@extends('app')
@section('content')
    <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/bootstrap-datepicker/css/bootstrap-datepicker.min.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;
        }
        .control{
          height: 45px;
        }
         .control h3{
          display: inline !important;
        }
        .brownbtn{
         background: #CF806B !important;
    }

    </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
    {{--{!! Breadcrumbs::render('admin.birthNews.index') !!}--}}

    <div class="row" id="reports-tabs">
        <div class="col-md-12">
            <ul id="tab-01" class="nav nav-tabs nav-tabs-rtl" style="background-color: transparent;">
                <li id="general_news"  class="active"><a href="#privateEvents"><span class="semi-bold">اخبار المواليد</span></a></li>
                <li id="requests" class=""><a  href="#Requests"><span class="semi-bold">استمارات التواصل <span class="badge badge-important">{{$received_count > 0 ? $received_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;">

                {{--Private Events Data Table--}}
                <div id="privateEvents" class="tab-pane active">

                    <div class="grid simple vertical mobile-scroll">
                        <div class="grid-body no-border">
                            <div class='row control'>
                                <div class="col-sm-3 col-xs-12">
                                    <div class="pull-right markaction">
                                @if(Auth::user()->hasPermission("birthNews-edit"))
                                    <a id="hide" href="javascript:void(0)" class="btn btn-warning" data-url="{{ URL::to('admin/birthNews/bulkhide') }}">نقل الى المسودة</a>
                                @endif
                                @if(Auth::user()->hasPermission("birthNews-destroy"))
                                    <a id="del" href="javascript:void(0)" class="btn btn-danger" data-url="{{ URL::to('admin/birthNews/bulkdelete') }}">حذف</a>
                                @endif
                                    </div>
                                </div>
                                <div class="col-sm-6 col-xs-12 c-page-title">
                                    <span>أخبار المواليد</span>
                                </div>
                                @if(Auth::user()->hasPermission("birthNews-create"))
                                    <div class="col-sm-3 col-xs-12">
                                        <a class="btn btn-primary" href="{{ URL::to('admin/birthNews/addParents') }}">إنشاء خبر مواليد</a>
                                    </div>
                                @endif
                            </div>
                            <table class="table table-bordered table-hover datatable" id="datatable-example">
                                <thead>
                                <tr>
                                @if(Auth::user()->hasPermission("birthNews-destroy") || Auth::user()->hasPermission("birthNews-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="40%">المعلومات</th>
                                    <th width="10%">اسم المولود</th>
                                    <th width="10%">التنبيه</th>
                                    <th width="20%">اخر تعديل</th>
                                    <th width="5%"></th>
                                </tr>
                                </thead>

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


                   <!--  <div class="grid-title" style="border: 0px;padding: 25px;margin: 0px;">

                        <h4>المسودة</h4>
                        <div class="tools">
                            <a class="collapse" href="javascript:;"></a>
                        </div>
                        <p>Some text will come here.Some text will come here.Some text will come here.Some text will come here.
                            Some text will come here.Some text will come here.Some text will come here.Some text will come here.
                            Some text will come here.Some text will come here.Some text will come here.Some text will come here.
                        </p>
                    </div> -->





                    <div class="grid simple vertical mobile-scroll">
                        <div class="grid-title no-border">
                            <!-- <h5><span class="semi-bold">Reports List</span></h5> -->
                        </div>
                        <div class="grid-body no-border">

                            <div class='row control'>
                                <!-- <h3>المسودة</h3> -->
                                <div class="col-sm-3 col-xs-12">
                                    <div class="pull-right markaction">
                                    @if(Auth::user()->hasPermission("birthNews-edit"))
                                        <a id="hide2" href="javascript:void(0)" class="btn btn-success" data-url="{{ URL::to('admin/birthNews/bulkshow') }}">انشر </a>
                                        @endif
                                    @if(Auth::user()->hasPermission("birthNews-destroy"))
                                        <a id="del2" href="javascript:void(0)" class="btn btn-danger" data-url="{{ URL::to('admin/birthNews/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("birthNews-destroy") || Auth::user()->hasPermission("birthNews-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="40%">المعلومات</th>
                                    <th width="10%">اسم المولود</th>
                                    <th width="10%">التنبيه</th>
                                    <th width="20%">اخر تعديل</th>
                                    <th width="5%"></th>
                                </tr>
                                </thead>

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

                {{--Requests Data Table--}}

                <div id="Requests" class="tab-pane">
                    <div class="grid simple vertical mobile-scroll">
                        <div class="grid-body no-border">

                            <div class='control'>
                                <!-- <h3>استمارات التواصل</h3> -->
                                <div class="col-sm-3 col-xs-12">
                                    <div class="pull-right markaction">
                                    @if(Auth::user()->hasPermission("birthNews-destroy"))
                                        <a id="del3" href="javascript:void(0)" class="btn btn-danger" data-url="{{ URL::to('admin/birthNews/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-example3">
                                <thead>
                                <tr>
                                @if(Auth::user()->hasPermission("birthNews-destroy") || Auth::user()->hasPermission("birthNews-edit"))
                                    <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example3 .checkboxes" /></th>
                                @else
                                    <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example3 .checkboxes" disabled/></th>
                                @endif
                                    <th>#</th>
                                    <th width="10%">الاستمارة</th>
                                    <th width="40%">المعلومات</th>
                                    <th width="10%">اسم المولود</th>
                                    <th width="10%">التنبيه</th>
                                    <th width="20%">اخر تعديل</th>
                                    <th width="5%"></th>
                                </tr>
                                </thead>

                            </table>

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

                {{--Archives Data Table--}}
                <div id="Archives" class="tab-pane">
                    <div class="grid simple vertical mobile-scroll">
                        <div class="grid-body no-border">

                            <div class='control'>
                                <!-- <h3>الارشيف</h3> -->
                                <div class="col-sm-3 col-xs-12">
                                    <div class="pull-right markaction">
                                        {{--<a id="show4" href="javascript:void(0)" class="btn btn-success" data-url="{{ URL::to('admin/birthNews/bulkshow') }}">انشر </a>
                                        <a id="hide4" href="javascript:void(0)" class="btn btn-warning" data-url="{{ URL::to('admin/birthNews/bulkhide') }}">نقل الى المسودة</a>--}}
                                    @if(Auth::user()->hasPermission("birthNews-destroy"))
                                        <a id="del4" href="javascript:void(0)" class="btn btn-danger" data-url="{{ URL::to('admin/birthNews/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">
                                <thead>
                                <tr>
                                @if(Auth::user()->hasPermission("birthNews-destroy") || Auth::user()->hasPermission("birthNews-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="40%">المعلومات</th>
                                    <th width="10%">اسم المولود</th>
                                    <th width="10%">التنبيه</th>
                                    <th width="20%">اخر تعديل</th>
                                    <th width="5%"></th>
                                </tr>
                                </thead>

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

            </div>
        </div>
    </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/birthnews/pushnotification','method' => 'POST'
                    ,'id'=>'push_notification_form']) !!}
            <input type="hidden" name="id" id="birth_news_id">
            <input type="hidden" name="publish" id="push_modal_publish_field">
            <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']) !!}
                    </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>


<div class="modal fade" id="editPublishModal" tabindex="-1" role="dialog" aria-labelledby="editPublishModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                {!! Form::open(['method' => 'POST','route' => 'birthNews.updatepublish','id'=>'form_editpublish']) !!}
                <div class="modal-header">
                    <h4 class="modal-title" id="editPublishModalLabel">تغيير تاريخ النشر</h4>

                </div>
                <div class="modal-body">
                    <input type="hidden" name="birth_news_id" id="birth_news_id_input" value="">

                <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_at_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('publish_date',  null, ['class' => 'form-control','id'=>'published_at_input']) !!}
                    </div>
                </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" onclick='$("#editPublishModal").modal("hide");' aria-label="Close"><span aria-hidden="true">إلغاء</span></button>
                    <button type="submit" class="btn btn-primary btn-cons brownbtn">حفظ</button>
                </div>
                {!! Form::close() !!}
        </div>
    </div>
</div>




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

<script type="text/javascript" language="javascript" class="init">
    $.ajaxSetup({
        headers: {'X-CSRF-Token': $('meta[name=_token]').attr('content')},
    });
    jQuery('#form_editpublish').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('#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();
        }, 500);
        jQuery('#progressbar').show();

        return true;
    });
    function pushNotificationModal(){
        $('#pushNotificationModal').modal('show');
    }
    function closePushNotificationModal(id) {
        $(id).modal('hide');
    }
    jQuery(document).ready(function ($) {
        $('#published_at_input').datepicker({format: 'dd/mm/yyyy',autoclose: true});
        $('#publish_date_time_field').clockpicker({autoclose: true});

        // 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 = $(document).find('.children_names_'+id+' label').data('notification');
          var pushed = $(this).data('pushed');
          var birth_type = $(this).data('birth_type');
          var pushed_flag = pushed==0 ? 'لا' : 'نعم';
          // if (birth_type=='single') {

          // }

          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);
          $('#birth_news_id').val(id);

          pushNotificationModal();
        });
        $('#push_modal_push_and_publish_btn').click(function(e){
          $('#push_modal_push_and_publish_field').val('yes')
          $('#push_notification_form').trigger('submit');
        });

        // 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: 'child_name', name: 'birth_news_baby_infos.baby_name'},
            {data: 'is_pushed', name: 'is_pushed'},
            {data: 'updated_at', name: 'updated_at'},
            {data: 'actions', name: 'actions'}
        ];
        var columnDefs = [
            {
                "targets": [1],
                "visible": true,
                "searchable": false
            },
            {
                "targets": [0,1,2,3,4,5,6,7],
                "searchable": false
            },
            {
                "targets": [0, 1, 2, 3,4],
                "orderable": false
            },
            {
                "targets": [1,2,3,4,5,6],
                "className": 'dt-body-right'
            }
        ];

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

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

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

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

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

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

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

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

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

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

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

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

        $('#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");

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

     });

    function editPublishDate(element){
        var id= $(element).data('id');
        var publish_date= $(element).data('date');
        var publish_date_time= $(element).data('time');
        $('#published_at_input').val(publish_date);
        $('#publish_date_time_field').val(publish_date_time);
        $('#birth_news_id_input').val(id);
        $('#editPublishModal').modal('show');
    }

</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