@extends ('backend.layouts.app')

@section ('title', trans('labels.backend.newsletters.management'))

@section('page-header')
    <h1>International News</h1>
@endsection

@section('content')
<div class="box box-info">
<div class="box-header with-border">
        <span><p id="message"></p></span>
        <div class="box-body">
            <div class="table-responsive data-table-wrapper">
                <table id="articles-table" class="table table-condensed table-hover table-bordered">
                    <thead>
                        <tr>
                            <th>{{ trans('labels.backend.newsletters.table.id') }}</th>
                            <th>Title</th>
                            <th>Publish Date</th>
                            <th>{{ trans('labels.general.actions') }}</th>
                            
                        </tr>
                    </thead>
                    <thead class="transparent-bg">
                        <tr>
                            <th></th>
                            <th></th>
                            <th></th>
                            <th></th>
                         
                        </tr>
                    </thead>
                    <tbody>
                       
                    </tbody>
                </table>
            </div>
        </div>
    </div>

@endsection
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>    
        <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
        <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
        <script>
        $.noConflict();
        jQuery( document ).ready(function( $ ) {
        $(function() {
        $.ajaxSetup({
        headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
        });
        $("#articles-table tbody").sortable({
        appendTo: "parent",
        helper: "clone",
        update: function (event, ui) {
        var data = $(this).sortable('serialize');
        $.ajax({
        data: data,
        type: 'POST',
        url: '{{ url("/admin/articles/sorteditor/")}}'
        });

        }
        }).disableSelection();
        });
        });
        </script>
        <script>
        $(document).ready(function(){
        fetch_data();

        function fetch_data()
        {var _token = "{{ csrf_token() }}";
        id = $('#newsletterId').val();
        $.ajax({
        url:"{{ url('admin/articles/fetch_dataeditor') }}",
        data:{id:id, _token:_token},
        dataType:"json",
        type:"post",
        success:function(data)
        {
        var html = '';
        for(var count=0; count < data.length; count++)
        {
        html +='<tr id="view_'+data[count].asigned_id+'">';
        html +='<td>'+data[count].article_id+'</td>';
        html += '<td>'+data[count].title+'</td>';
        html += '<td>'+data[count].publish_date+'</td>';

        html += '<td><button type="button" class="btn btn-danger" id="'+data[count].article_id+'">Fix On Top</button></td></tr>';
        }
        $('#articles-table tbody').html(html);
        }
        });
        }
        var _token = "{{ csrf_token() }}";
        });


        </script>