@extends('app')
@section('content')
<link href="{{ asset('assets/plugins/bootstrap-datepicker/css/bootstrap-datepicker.min.css')}}" rel="stylesheet" type="text/css" media="screen"/>
<link href="{{ asset('assets/plugins/jquery-notifications/css/messenger.css')}}" rel="stylesheet" type="text/css" media="screen"/>
<link href="{{ asset('assets/plugins/jquery-notifications/css/messenger-theme-flat.css')}}" rel="stylesheet" type="text/css" media="screen"/>
<link href="{{ asset('assets/plugins/boostrap-clockpicker/bootstrap-clockpicker.min.css')}}" rel="stylesheet" type="text/css" media="screen"/>
<style type="text/css">
    .clockpicker-popover{
        z-index: 2000;
    }
    .clockpicker-button {
        display: none;
    }
</style>
@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" id="reports-tabs">
    <div class="col-md-12">
        <ul id="tab-01" class="nav nav-tabs nav-tabs-rtl">
            <li id="Death_news"  class="active"><a href="#deathnews"><span class="semi-bold">اخبار الوفيات</span></a></li>
            <li id="requests" class=""><a  href="#Requests"><span class="semi-bold">استمارات التواصل  <span class="badge badge-important">{{$request_count>0 ? $request_count : '' }}</span></span></a></li>
            <li id="archives"  class=""><a href="#Archives"><span class="semi-bold">الطلبات المكتملة</span></a></li>
        </ul>
        <div class="tab-content" style="padding: 0px !important;">
            <div id="deathnews" class="tab-pane active">

              <div class="grid simple vertical mobile-scroll">
                  <div class="grid-body no-border">
                      <div class='row control' style="height: 45px;">
                        <div class="col-sm-3 col-xs-12">
                          <div class="pull-right markaction">
                            @if(Auth::user()->hasPermission("deathnews-edit"))
                              <a id="hide" href="javascript:void(0)" class="btn btn-warning" data-url="{{ URL::to('admin/deathnews/bulkhide') }}">إيقاف النشر</a>
                            @endif
                            @if(Auth::user()->hasPermission("deathnews-destroy"))
                              <a id="del" href="javascript:void(0)" class="btn btn-danger" data-url="{{ URL::to('admin/deathnews/bulkdelete') }}">حذف</a>
                          @endif
                          </div>
                        </div>
                        <div class="col-sm-6 col-xs-12 c-page-title">
                            <span>أخبار الوفيات</span>
                        </div>
                        @if(Auth::user()->hasPermission("deathnews-create"))
                        <div class="col-sm-3 col-xs-12">
                          <a href="{{ URL::to('admin/deathnews/create') }}" class="btn btn-primary btn-lg">إنشاء خبر وفاة</a>
                        </div>
                        @endif
                      </div>
                      <table class="table table-bordered table-hover datatable" id="datatable-example">
                          <thead>
                            <tr>
                            @if(Auth::user()->hasPermission("deathnews-destroy") || Auth::user()->hasPermission("deathnews-edit"))
                                <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example .checkboxes" /></th>
                            @else
                                <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example .checkboxes" disabled/></th>
                            @endif
                                <th>#</th>
                                <th width="10%">الاستمارة</th>
                                <th width="50%">المعلومات</th>
                                <th width="10%">التنبيه</th>
                                <th width="20%">اخر تعديل</th>
                                <th width="5%"></th>
                            </tr>
                          </thead>

                        </table>

                  </div>
              </div>

              <div class="grid simple vertical mobile-scroll">
                  <div class="grid-body no-border">
                        <div class='row control' style="height: 45px;">
                          <!-- <span class="" style="font-size: 24px; color: #505458; font-weight: 300">المسودة</span> -->
                            <div class="col-sm-3 col-xs-12">
                                <div class="pull-right markaction">
                                @if(Auth::user()->hasPermission("deathnews-edit"))
                                    <a id="show2" href="javascript:void(0)" class="btn btn-success" data-url="{{ URL::to('admin/deathnews/bulkshow') }}">انشر الان</a>
                                @endif
                                @if(Auth::user()->hasPermission("deathnews-destroy"))
                                    <a id="del2" href="javascript:void(0)" class="btn btn-danger" data-url="{{ URL::to('admin/deathnews/bulkdelete') }}">حذف</a>
                                @endif
                                </div>
                            </div>
                            <div class="col-sm-6 col-xs-12 c-page-title">
                                <span>المسودة</span>
                            </div>
                        </div>
                      <table class="table table-bordered table-hover datatable" id="datatable-example2">
                          <thead>
                          <tr>
                            @if(Auth::user()->hasPermission("deathnews-destroy") || Auth::user()->hasPermission("deathnews-edit"))
                                <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example2 .checkboxes" /></th>
                            @else
                                <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example2 .checkboxes" disabled/></th>
                            @endif
                              <th>#</th>
                              <th width="10%">الاستمارة</th>
                              <th width="50%">المعلومات</th>
                              <th width="10%">التنبيه</th>
                              <th width="20%">اخر تعديل</th>
                              <th width="5%"></th>
                          </tr>
                          </thead>

                      </table>

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

              <div id="Requests" class="tab-pane">
              <div class="grid simple vertical mobile-scroll">
                  <div class="grid-body no-border">
                      <div class='control' style="height: 45px;">
                        <div class="col-sm-3 col-xs-12">
                            <div class="pull-right markaction">
                            @if(Auth::user()->hasPermission("deathnews-destroy"))
                              <a id="del4" href="javascript:void(0)" class="btn btn-danger" data-url="{{ URL::to('admin/deathnews/bulkdelete') }}">حذف</a>
                            @endif
                            </div>
                          </div>
                          <div class="col-sm-6 col-xs-12 c-page-title">
                                <span>أخبار الوفيات - استمارات التواصل</span>
                            </div>
                            <div class="col-sm-3 col-xs-12"></div>
                      </div>
                      <table class="table table-bordered table-hover datatable" id="datatable-example4" width="100%">
                          <thead>
                          <tr>
                            @if(Auth::user()->hasPermission("deathnews-destroy") || Auth::user()->hasPermission("deathnews-edit"))
                            <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example4 .checkboxes" /></th>
                            @else
                            <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example4 .checkboxes" disabled/></th>
                            @endif
                              <th>#</th>
                              <th width="10%">الاستمارة</th>
                              <th width="50%">المعلومات</th>
                              <th width="10%">التنبيه</th>
                              <th width="20%">اخر تعديل</th>
                              <th width="5%"></th>
                          </tr>
                          </thead>

                      </table>


                  </div>
              </div>
            </div>
             <div id="Archives" class="tab-pane">
              <div class="grid simple vertical mobile-scroll">
                  <div class="grid-body no-border">
                        <div class='control' style="height: 45px;">
                            <div class="col-sm-3 col-xs-12">
                                <div class="pull-right markaction">
                                @if(Auth::user()->hasPermission("deathnews-destroy"))
                                    <a id="del5" href="javascript:void(0)" class="btn btn-danger" data-url="{{ URL::to('admin/deathnews/bulkdelete') }}">حذف</a>
                                @endif
                                </div>
                            </div>
                            <div class="col-sm-6 col-xs-12 c-page-title">
                                <span>أخبار الوفيات - الطلبات المكتملة</span>
                            </div>
                            <div class="col-sm-3 col-xs-12"></div>
                        </div>
                      <table class="table table-bordered table-hover datatable" id="datatable-example5" width="100%">
                          <thead>
                          <tr>
                            @if(Auth::user()->hasPermission("deathnews-destroy") || Auth::user()->hasPermission("deathnews-edit"))
                            <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example5 .checkboxes" /></th>
                            @else
                            <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example5 .checkboxes" disabled/></th>
                            @endif
                              <th>#</th>
                              <th width="10%">الاستمارة</th>
                              <th width="50%">المعلومات</th>
                              <th width="10%">التنبيه</th>
                              <th width="20%">اخر تعديل</th>
                              <th width="5%"></th>
                          </tr>
                          </thead>

                      </table>


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

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

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


<div id="publishModal" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">

            <div class="modal-header">
                <label style="font-size: 16px;color: grey;"></label>
                <h4 class="modal-title">تغيير تاريخ النشر</h4>
            </div>
            {!! Form::open(['url' => 'admin/deathnews/bulkshow?source=publish_later','method' => 'POST'
                    ,'id'=>'change_date_form']) !!}
            <input type="hidden" name="publish_only">
            <input type="hidden" name="change_date" id="change_date" value="">
            <input type="hidden" name="news_ids" id="news_ids">
            <div class="modal-body">

                 <div class="form-group row">
                    <div class="col-md-1 col-sm-12">

                    </div>
                    <div class="col-md-9 col-sm-12">
                    </div>
                </div>
                <div class="form-group row">
                    <div class="col-md-1 col-sm-12">

                    </div>
                    <div class="input-with-icon  right col-md-3 col-sm-12 col-md-offset-1">
                        <label class="form-label">الوقت</label>
                        {!! Form::text('published_date_time',  null, ['class' => 'form-control','id'=>'publish_date_time_field']) !!}
                    </div>
                    <div class="input-with-icon  right col-md-5 col-sm-12">
                        <label class="form-label">تاريخ النشر</label>
                        {!! Form::text('published_date',  null, ['class' => 'form-control','id'=>'publish_date_field']) !!}
                    </div>
                </div>
                <div class="form-group row">
                    <div class="col-md-1 col-sm-12">

                    </div>
                    <div class="input-with-icon  right col-md-9 col-sm-12 notification-box">
                        {!! Form::label('notification', 'اكتب نص الإشعار أدناه', ['class' => 'form-label']) !!}
                        {!! Form::text('notification', null, ['class' => 'form-control','id'=>'publish_date_field', 'style'=>'direction: rtl;']) !!}
                    </div>
                </div>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">إلغاء</button>
                <input type="submit" name="push_and_publish" class="btn btn-primary" id="push_and_publish_btn" value="Push and Publish">
                {!! Form::submit('حفظ', ['class' => 'btn btn-primary btn-cons','id'=>'publish_modal_submit']) !!}
            </div>
            {!! Form::close() !!}

        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>


<div id="pushNotificationModal" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">

            <!-- <div class="modal-header">
                <label style="font-size: 16px;color: grey;"></label>
            </div> -->
            {!! Form::open(['url' => 'admin/deathnews/pushnotification','method' => 'POST'
                    ,'id'=>'push_notification_form']) !!}
            <input type="hidden" name="id" id="death_news_id">
            <input type="hidden" name="publish" id="push_modal_publish_field">
            <input type="hidden" name="notification_fullname" id="notification_fullname">
            <input type="hidden" name="push_modal_push_and_publish" id="push_modal_push_and_publish_field" value="no">
            <div class="modal-body">
                <div class="form-group row">
                    <div class="col-md-1 col-sm-12">

                    </div>
                    <div class="input-with-icon  right col-md-9 col-sm-12 notification-box">
                        <label class="form-label">إرسلت رسالة تنبيه من قبل؟ <span id="push_was_sent_flag">لا</span></label>
                    </div>
                </div>
                <div class="form-group row">
                    <div class="col-md-1 col-sm-12">

                    </div>
                    <div class="input-with-icon  right col-md-9 col-sm-12 notification-box">
                        {!! Form::label('notification', 'اكتب رسالة التنبيه في الاسفل', ['class' => 'form-label']) !!}
                        {!! Form::text('notification', null, ['class' => 'form-control','id'=>'push_notification_field' ,'style'=>'direction: rtl;']) !!}
                    </div>
                </div>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">إلغاء</button>
                <a href="javascript:void(0)" class="btn btn-primary" id="push_modal_push_and_publish_btn">نشر مع ارسال تنبيه</a>
                {!! Form::submit('نشر فقط', ['class' => 'btn btn-primary','id'=>'push_modal_submit']) !!}
            </div>
            {!! Form::close() !!}

        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>

<script type="text/javascript" language="javascript" class="init">
$.ajaxSetup({
        headers: {'X-CSRF-Token': $('meta[name=_token]').attr('content')},
    });
    jQuery('#change_date_form').submit(function (event) {
        var pass = true;
        //some validations

        if (pass == false) {
            return false;
        }
        form = this;
        jQuery('#btn-submit').attr('disabled', 'disabled');
        event.preventDefault();
        setTimeout(function () {
            form.submit();
        }, 500);
        jQuery('#progressbar').show();

        return true;
    });
    jQuery('#push_notification_form').submit(function (event) {
        var pass = true;
        //some validations

        if (pass == false) {
            return false;
        }
        form = this;
        jQuery('#btn-submit').attr('disabled', 'disabled');
        event.preventDefault();
        setTimeout(function () {
            form.submit();
            jQuery('#progressbar').show();
        }, 500);
        jQuery('#progressbar').hide();

        return true;
    });
    jQuery(document).ready(function ($) {
        $('body').append($('.modal'));
        // When click on Push notification btn or publish btn show notification modal
        $(document).on('click','.send_push_btn', function(e){
          var id = $(this).data('id');
          var title = $(this).data('title');
          var fullname = $(this).data('fullname');
          $('#notification_fullname').val(fullname);
          var pushed = $(this).data('pushed');
          var pushed_flag = pushed==0 ? 'لا' : 'نعم';
          var notification = title;
          var request_type = $(this).data('type')
          if (request_type=='push_and_publish') {
            $('#push_modal_publish_field').val('yes');
            $('#push_modal_submit').val('نشر فقط');
            $('#push_modal_push_and_publish_btn').show();
          }else{
            $('#push_modal_submit').val('تنبيه');
            $('#push_modal_publish_field').val('no');
            $('#push_modal_push_and_publish_btn').hide();
          }
          if (pushed==0) {
            // $('#push_notification_field').prop('readonly',true);
            $('#push_notification_field').removeAttr('readonly');
          }else{
            // $('#push_notification_field').prop('readonly',true);
            $('#push_notification_field').removeAttr('readonly');
          }
          $('#push_notification_field').val(notification);
          $('#push_was_sent_flag').text(pushed_flag);
          $('#death_news_id').val(id);

          jQuery('#pushNotificationModal').modal('show');
        });
        $('#push_modal_push_and_publish_btn').click(function(e){
          $('#push_modal_push_and_publish_field').val('yes')
          $('#push_notification_form').trigger('submit');
        });
        // When click on publish later btn show publish later modal
        $(document).on('click','.publish_later', function(){
            var type = $(this).data('type');
            var ids = '';
            if (type=='change-date') {
                ids = $(this).data('id');
                $('#change_date').val('yes');
                $('#push_and_publish_btn').hide()
                $('.notification-box').hide();
                $('#publish_modal_submit').val('حفظ');
                $('#publish_date_field').val($(this).data('date'));
                $('#publish_date_time_field').val($(this).data('time'));
            }else{
                $('#datatable-example2 tbody tr td input[type="checkbox"]').each(function(count,input){
                    ids = ids=='' ?  ids + input.value : ids + ',' + input.value;
                });
                $('#change_date').val('');
                $('#push_and_publish_btn').show()
                $('.notification-box').show();
                $('#publish_modal_submit').val('حفظ');
            }

            $('#news_ids').val(ids);
            if (ids == '' || ids == null) {
                showErrorMessage('Nothing Selected');
            }else{
                jQuery('#publishModal').modal('show');
            }
        });
        $('#publish_date_field').datepicker({format: 'dd/mm/yyyy'});
        $('#publish_date_time_field').clockpicker({autoclose: true});

      // Columns and column defs to be used in both tables
        var columns = [
            {data: 'check', name: 'check'},
            {data: 'id', name: 'id'},
            {data: 'request_id', name: 'request_id'},
            {data: 'information', name: 'information'},
            {data: 'is_pushed', name: 'is_pushed'},
            {data: 'updated_at', name: 'updated_at'},
            {data: 'actions', name: 'actions'}
        ];
        var columnDefs = [
            {
                "targets": [1],
                "visible": false,
                "searchable": false
            },
            {
              "width": '55%',
              "targets":[3]
            },
            {
                "targets": [0, 1, 2, 3, 4,5,6],
                "searchable": false
            },
            {
                "targets": [0, 1, 2, 3, 4,5,6],
                "orderable": false
            },
            {
                "targets": [1,2,3,4,5],
                "className": 'dt-body-right'
            }
        ];
        // $('a[data-toggle="tab"]').on( 'shown.bs.tab', function (e) {
        //     $.fn.dataTable.tables( {visible: true, api: true} ).columns.adjust();
        // } );

        $('#datatable-example').DataTable({

            processing: true,
            serverSide: true,
            "autoWidth": false,
            "order": [[1, "desc"]],
            "pageLength": 10,
            language: {
                search: "",
                searchPlaceholder: "بحث",
						processing: "<img src='{{url('/')}}/assets/img/Webp.net-resizeimage.gif' />",
						emptyTable: "لا يوجد محتوى",
						zeroRecords: "لا يوجد محتوى",

						},
            ajax: {
                "url": "{{ URL::to('admin/deathnews/datatable?status=1') }}",
                "type": "POST"
            },
            columns: columns,
            "columnDefs": columnDefs
        });

        $('#datatable-example2').DataTable({

            processing: true,
            serverSide: true,
            "autoWidth": false,
            "order": [[1, "desc"]],
            "pageLength": 10,
            language: {
                search: "",
                searchPlaceholder: "بحث",
						processing: "<img src='{{url('/')}}/assets/img/Webp.net-resizeimage.gif' />",
						emptyTable: "لا يوجد محتوى",
						zeroRecords: "لا يوجد محتوى",

						},
            ajax: {
                "url": "{{ URL::to('admin/deathnews/datatable?status=0') }}",
                "type": "POST"
            },
            columns: columns,
            "columnDefs": columnDefs
        });

        var request = $('#datatable-example4').DataTable({

            processing: true,
            serverSide: true,
            "autoWidth": false,
            "order": [[1, "desc"]],
            "pageLength": 25,
            language: {
                search: "",
                searchPlaceholder: "بحث",
						processing: "<img src='{{url('/')}}/assets/img/Webp.net-resizeimage.gif' />",
						emptyTable: "لا يوجد محتوى",
						zeroRecords: "لا يوجد محتوى",

						},
            ajax: {
                "url": "{{ URL::to('admin/deathnews/datatable?status=2') }}",
                "type": "POST"
            },
            columns: columns,
            "columnDefs": columnDefs
        });

        var request2 = $('#datatable-example5').DataTable({

            processing: true,
            serverSide: true,
            "autoWidth": false,
            "order": [[1, "desc"]],
            "pageLength": 25,
            language: {
                search: "",
                searchPlaceholder: "بحث",
						processing: "<img src='{{url('/')}}/assets/img/Webp.net-resizeimage.gif' />",
						emptyTable: "لا يوجد محتوى",
						zeroRecords: "لا يوجد محتوى",

						},
            ajax: {
                "url": "{{ URL::to('admin/deathnews/datatable?status=3') }}",
                "type": "POST"
            },
            columns: columns,
            "columnDefs": columnDefs
        });
        // $( "#tab-death-mod" ).tabs({
        //   "show": function(event, ui) {
        //     console.log('tabs');
        //    var table = $.fn.dataTable.fnTables(true);
        //    if ( table.length > 0 ) {
        //         $(table).dataTable().fnAdjustColumnSizing();
        //       }

        //   }
        // });
        // var request_loaded =false;
        // var archive_loaded =false;
        // $('#tab-death-mod a').click(function (e) {
        //   e.preventDefault();
        //   $(this).tab('show');
        //   var parent_id = $(this).parent().attr('id');
        //   // console.log(parent_id);
        //   if(parent_id!='Death_news'){
        //     var load = false;
        //     if (parent_id=='requests' && !request_loaded) {
        //       load = true;
        //       request_loaded = true;
        //     }else if (parent_id=='archives' && !request_loaded) {
        //       load = true;
        //       archive_loaded = true;
        //     }
        //     if (load) {
        //       var table = $.fn.dataTable.fnTables({visible: true, api: true});
        //       if ( table.length > 0 ) {
        //         $(table).dataTable().fnAdjustColumnSizing();
        //       }
        //     }
        //   }
        // });
        // $('.nav-tabs a').click(function(e){
        //   console.log($(this).parent().attr('id')!='Death_news');
        //   if($(this).parent().attr('id')!='Death_news'){
        //     var table = $.fn.dataTable.fnTables({visible: true, api: true});
        //     console.log(table);
        //     if ( table.length > 0 ) {
        //       $(table).dataTable().fnAdjustColumnSizing();
        //     }
        //   }
        // });
        $('#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-example2_wrapper .dataTables_filter input').addClass("input-medium "); // modify table search input
        $('#datatable-example2_wrapper .dataTables_length select').addClass("select2-wrapper span12"); // modify table per page dropdown
        $('#datatable-example2_wrapper .dataTables_length select').removeClass("form-control");

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

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

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

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

        $(".select2-wrapper").select2({minimumResultsForSearch: -1});

    });
    /*function showMap(id,type) {
        console.log(type);
        var report_type = 'normal';
        if (type==0) {
            report_type = 'wrong_location';
        };
        jQuery('#progressbar').show();
        var modal = $('#moment_map_modal').modal();
        $('#moment_map').html('');
        modal.show();
        $('#moment_map').load('/admin/reports/'+id+'?'+report_type+'=true',function(){setTimeout(function() {jQuery('#progressbar').hide();}, 800); });
    }*/
</script>
<script src="{{ asset('assets/js/tabs_accordian.js')}}" type="text/javascript"></script>
<script src="{{ asset('assets/plugins/jquery-notifications/js/messenger.min.js')}}" type="text/javascript"></script>
<script src="{{ asset('assets/plugins/jquery-notifications/js/messenger-theme-future.js')}}" type="text/javascript"></script>
@endsection