@extends('admin.layouts.admin')
 @section('content')
     <div class="container-fluid">
         <div class="table-block-common">
             <!-- Card header -->
             <div class="top-title-block-table">
                 <div class="top-title-block-table-left common-btn-admin">
                     @if (isset($module_name))
                         <h2 class="sdial-darkbox-subtitle-text20">{{ $module_name }}</h2>
                     @endif
                     <button class="btn btn-yellow-admin addnewsclass">
                         <i class="fas fa-plus me-2"></i>
                         <span>
                             @if (isset($module_name))
                                 Add {{ $module_name }}
                             @endif
                         </span>
                     </button>
                 </div>
                 <span class="selectfilter">
                     <img src="/assets/img/filter-icon.svg" />
                 </span>
             </div>
             <div class="table-common-block">
                 <div class="table-responsive">
                     <table class="table table-flush" id="datatable-basic">
                         <thead class="thead-light">
                             <tr>
                                 <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                                     Title
                                 </th>
                                 <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                                     Date Added
                                 </th>
                                 <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                                     External URL
                                 </th>
                                 <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                                     Status
                                 </th>
                                 <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                                     Pin to top
                                 </th>
                                 <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">
                                     Action
                                 </th>
                             </tr>
                         </thead>
                         <tbody>
                         </tbody>
                     </table>
                 </div>
             </div>
         </div> 
     </div>
     <!-- The Modal -->
     <div id="myModal2" class="modal myModal2 common-modal-block filter-modal-block">
         <!-- Modal content -->
         <div class="modal-content">
             <div class="modal-header">
                 <h2>Filters</h2>
                 <a href="#" class="rmvfiltermodel">
                     <img src="/assets/img/close-icon-modal.svg" alt="close-icon">
                 </a>
             </div>
             <div class="modal-body"> 
                 <div class="form-block-check">
                    <div class="form-check">
                        <span>Status</span>
                    </div>
                     <div class="form-check">
                         <input class="form-check-input filter-type-id" type="checkbox" name="status" value="1"
                             id="visible" checked />
                         <label class="form-label" for="visible">Visible</label>
                     </div>
                     <div class="form-check">
                         <input class="form-check-input filter-type-id" type="checkbox" name="status" value="0"
                             id="invisible" checked />
                         <label class="form-label" for="invisible">Invisible</label>
                     </div>
                 </div>
             </div>
             <div class="modal-footer-block news-buttom-green">
                 <p>
                     {{-- <svg width="20" height="20" viewBox="0 0 20 20" fill="none"
                         xmlns="http://www.w3.org/2000/svg">
                         <path fill-rule="evenodd" clip-rule="evenodd"
                             d="M20 10C20 15.5228 15.5228 20 10 20C4.47715 20 0 15.5228 0 10C0 4.47715 4.47715 0 10 0C15.5228 0 20 4.47715 20 10ZM10 9C10.5128 9 10.9355 9.38604 10.9933 9.88338L11 10V14C11 14.5523 10.5523 15 10 15C9.48716 15 9.06449 14.614 9.00673 14.1166L9 14V10C9 9.44771 9.44771 9 10 9ZM11.01 6C11.01 5.44772 10.5623 5 10.01 5L9.88338 5.00673C9.38604 5.06449 9 5.48716 9 6C9 6.55228 9.44771 7 10 7L10.1266 6.99327C10.624 6.93551 11.01 6.51284 11.01 6Z"
                             fill="#FCBD14" />
                     </svg> --}}
                     <span id="total-match">0 matches found</span>
                 </p>
                 <button class="common-modal btn savefilter">Save Filters</button>

             </div> 
         </div>
     </div>
     <!-- The Modal -->
     <div id="myModal11" class="modal myModal11 common-modal-block">
         <!-- Modal content -->
         <div class="modal-content">
             <div class="modal-header">
                 <h2>Add News</h2>
                 <a href="#" class="rmvmodel11">
                     <img src="/assets/img/close-icon-modal.svg" alt="close-icon">
                 </a>
             </div>
             <div class="modal-body">
                 <form method="POST" id="newsform11">
                     @csrf

                     <div class="form-group">
                         <label>Title</label>
                         <input type="text" name="name" id="name" class="form-control" value=""
                             placeholder="Title of news">
                         <span class="nameError" style="color:red"></span>
                     </div>
                     <div class="form-group">
                         <label>URL</label>
                         <input type="url" name="url" id="url" class="form-control" value=""
                             placeholder="https://">
                         <span class="urlError" style="color:red"></span>
                     </div>

                     <input type="hidden" name="oldeditid" id="oldeditid" value="">
                     <div class="modal-footer-block">
                         <span class="btn btn-cancel mb-0 rmvmodel11">Cancel</span>
                         <button type="button" class="btn mb-0 savenews11 common-modal">Save</button>
                     </div> 
                 </form>
             </div>
         </div>
     </div>
 @endsection

 @push('js')
     <script>
         var oTable = $('#datatable-basic').DataTable({
             "pageLength": 10,
             processing: true,
             serverSide: true,
             searchable: true,
             fixedHeight: true,
             language: {
                searchPlaceholder: "Search",
                sEmptyTable: "No news articles match.",
                info: "_START_ - _END_ of _MAX_",
             },
            //  oLanguage: {
            //     sEmptyTable: "No news articles match."
            //  }, 
             
             "ajax": {
                 "url": "{!! $module_route . '/datatable' !!}",
                 "data": function(d) {
                     d.type_id = $('input[name="status"]:checked').serializeArray();
                 },
             },
             columns: [{
                     data: 'name',
                     name: 'name',
                     "orderable": false,
                     "width": "30%",
                     class: 'dark-balck-td',
                 },
                 {
                     data: 'added_date',
                     searchable: false,
                     "width": "10%",
                     name: 'created_at'
                 },
                 {
                     data: 'url',
                     name: 'url',
                     "orderable": false,
                     "width": "30%",
                 },
                 {
                     data: null, 
                     "orderable": false,
                     "searchable": false,
                     "render": function(o) {
                         if (o.status == '0') {
                             return '<lable class="btn btn-default">Invisible</lable>';
                         } else {
                             return '<lable class="btn btn-primary">Visible</lable>';
                         }

                     }
                 },
                 {
                     data: null,
                     "orderable": false,
                     "searchable": false,
                     "width": "10%",
                     "render": function(o) {
                         if (o.pintotop == '1') {
                             return '<a href="javascript:void(0);" class="updatepintotop common-pin-block" val="' +
                                 o.id +
                                 '"> <img src="/assets/img/unpin-img.svg" /><span>Unpin</span></a>';
                         } else {
                             return '<a href="javascript:void(0);" class="updatepintotop common-pin-block" val="' +
                                 o.id +
                                 '"><img src="/assets/img/pin-top-icon.svg" /> <span>Pin to top</span></a>';
                         }

                     }
                 },
                 {
                     data: null,
                     class: 'center-block',
                     "orderable": false,
                     "searchable": false,
                     "render": function(o) {
                         var str = "";
                         str +=
                             '<div class="custom-dropdwon-table"><div class="d-flex"><div class="dropdown"><button class="btn dost-icon-btn" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fas fa-ellipsis-v"></i></button><div class="dropdown-menu" aria-labelledby="dropdownMenu2">';
                         str += '<button class="dropdown-item" type="button"><a data-id="' + o.id +
                             '" class="addnewsclass" data-bs-toggle="tooltip" data-bs-original-title="Edit Project">Edit</a></button>';
                         str +=
                             '<button class="dropdown-item" type="button"><a href="javascript:void(0);" class="deleteRecord" val="' +
                             o.id + '">Delete</a></button>';
                         str +=
                             '<button class="dropdown-item" type="button"><a href="javascript:void(0);" class="updateRecord" val="' +
                             o.id + '">';
                         if (o.status == "0") {
                             str += "Make Visible";
                         } else {
                             str += "Make Invisible";
                         }
                         str += '</a></button></div></div></div></div>';
                         return str;
                     }
                 }
             ],
             order: [
                 [4, "DESC"]
             ],  
             drawCallback: function(data) {
                 $("#total-match").html(`${data.json.recordsTotal} matches founds`);
                 if(this.fnSettings().fnRecordsTotal() == 0)
                 {
                    $("#datatable-basic_info").html('');
                 } 
             },
         });
         $('.filter-type-id').change(function() {  
            getdata();
         });
         function getdata()
         {  
            var alltype = []; 
            // Initializing array with Checkbox checked values
            $("input[name='status']:checked").each(function(){
                alltype.push(this.value);
            }); 
            $.ajax({
                type: "POST",
                url: "{{ url('admin/news-management') }}/getNewsCount",
                data: {
                            "_token": window.Laravel.csrfToken,
                            "type_id":alltype
                        }, 
                success: function(data) {  
                    if(data.count==0)
                    { 
                        $('#total-match').html('No news match');
                    }
                    else
                    {
                        $('#total-match').html(data.count+' matches found');
                    }
                }, 
            }); 
         }
         $('.savefilter').click(function(e) {
             $(".myModal2").hide();  
             getdata()
             oTable.draw(false);
         });

         jQuery(document).on('click', '.selectfilter', function(event) {
             getdata();
             $(".myModal2").show();
         });
         jQuery(document).on('click', '.rmvfiltermodel', function(event) {
             $(".myModal2").hide();
         });

         jQuery(document).on('click', '.savenews11', function(event) {
             var editid = $("#oldeditid").val();
             var chkname = $('#name').val();
             var chkurl = $('#url').val();

             var pattern = /^(http|https)?:\/\/[a-zA-Z0-9-\.]+\.[a-z]{2,4}/;
             var chkpattern = pattern.test(chkurl);

             if (chkname == '') {
                 $('.nameError').html('Title is required');
             } else {
                 $('.nameError').html('');
             }
             if (chkurl == '') {
                 $('.urlError').html('URL is required');
             } else {
                 if (chkpattern == true) {
                     $('.urlError').html('');
                 } else if (chkpattern == false) {
                     $('.urlError').html('Invalid URL');
                 } else {
                     $('.urlError').html('');
                 }
             }

             if (chkpattern == true && chkurl != '' && chkname != '') {
                 if (editid == '') {
                     $.ajax({
                         type: 'POST',
                         url: "{!! url('admin/news-management') . '/news' !!}",
                         dataType: 'json',
                         data: $('#newsform11').serialize(),
                         success: function(data) {
                          //   fnToastSuccess(data['message']);
                             $(".myModal11").hide();
                             $('#name').val('');
                             $('#url').val('');
                             oTable.draw();
                         },
                         error: function(xhr, status, error) {
                             if (xhr.responseJSON && xhr.responseJSON.message != "") {
                                 swal("ohh snap!", xhr.responseJSON.message, "error");
                             } else {
                                 swal("ohh snap!", "Something went wrong", "error");
                             }
                             ajaxError(xhr, status, error);
                         }
                     });
                 } else {
                     $.ajax({
                         type: 'POST',
                         url: "{!! url('admin/news-management') . '/' . '"+editid+"' . '/edit' !!}",
                         dataType: 'json',
                         data: $('#newsform11').serialize(),
                         success: function(data) {
                           //  fnToastSuccess(data['message']);
                             $(".myModal11").hide();
                             $('#name').val('');
                             $('#url').val('');
                             oTable.draw(false);
                         },
                         error: function(xhr, status, error) {
                             if (xhr.responseJSON && xhr.responseJSON.message != "") {
                                 swal("ohh snap!", xhr.responseJSON.message, "error");
                             } else {
                                 swal("ohh snap!", "Something went wrong", "error");
                             }
                             ajaxError(xhr, status, error);
                         }
                     });
                 }
             }
         });
         jQuery(document).on('click', '.rmvmodel11', function(event) {
             $('#oldeditid').val('');
             $('#name').val('');
             $('#url').val('');
             $('.nameError').html('');
             $('.urlError').html('');
             $(".myModal11").hide();
         });

         jQuery(document).on('click', '.addnewsclass', function(event) {
             var editid = $(this).attr('data-id');
             if (editid == undefined) {
                 $('.titledisplay').html('Add News');
                 $(".myModal11").show();
             } else {
                 $('.titledisplay').html('Edit News');
                 $('#oldeditid').val(editid);
                 $.ajax({
                     type: 'GET',
                     url: "{!! url('admin/news-management') . '/' . '"+editid+"' . '/show' !!}",
                     dataType: 'json',
                     success: function(data) {
                         $('#name').val(data.news.name);
                         $('#url').val(data.news.url);
                         $(".myModal11").show();
                     },
                     error: function(xhr, status, error) {
                         if (xhr.responseJSON && xhr.responseJSON.message != "") {
                             swal("ohh snap!", xhr.responseJSON.message, "error");
                         } else {
                             swal("ohh snap!", "Something went wrong", "error");
                         }
                         ajaxError(xhr, status, error);
                     }
                 });
             }
         });

         //delete Record
         jQuery(document).on('click', '.deleteRecord', function() {
            var textSwal = "";
            textSwal = "Are you sure you want to delete the news?";
            var id = $(this).attr('val'); 
            swal({ 
                    text: textSwal,
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "Yes, Delete",
                    cancelButtonText: "No",
                })
                .then(function() {
                    $.ajax({ 
                        url: "{{ url('admin/news-management') }}/" + id +"/delete-new",
                        type: 'GET',
                        data: {
                            "_token": window.Laravel.csrfToken
                        },
                        success: function(data) { 
                            oTable.draw(false);
                        },
                        error: function(xhr, status, error) {
                            if (xhr.responseJSON && xhr.responseJSON.message != "") {
                                swal("ohh snap!", xhr.responseJSON.message, "error");
                            } else {
                                swal("ohh snap!", "Something went wrong", "error");
                            }
                            ajaxError(xhr, status, error);
                        }
                    });
                }, function(dismiss) {});
            });
        //  jQuery(document).on('click', '.deleteRecord', function(event) {
        //      var id = $(this).attr('val');
        //      var deleteUrl = "{!! $module_route !!}/" + id;
        //      var isDelete = deleteRecordByAjax(deleteUrl, "{{ $module_name }}", oTable);
        //  });

         //update Record
         jQuery(document).on('click','.updateRecord',function(){ 
                var id = $(this).attr('val');
                $.ajax({
                    type:'GET',
                    url: "{{ url('admin/news-management') }}/" + id + "/news-supdate",
                    data:'_token = <br />
<b>Fatal error</b>:  Uncaught Error: Call to undefined function csrf_token() in /var/www/html/resources/views/admin/laravel/news/index.blade.php:447
Stack trace:
#0 {main}
  thrown in <b>/var/www/html/resources/views/admin/laravel/news/index.blade.php</b> on line <b>447</b><br />