@extends('layouts.app')
@section('content')
    <div class="row">
        <div class="col-md-3">
            <section class="card card-featured-left card-featured-primary mbt-2">
                <div class="card-body brd1 position">
                    <div class="icon"><i class="fa fa-user-circle-o"></i></div>
                    <div class="widget-summary">
                        <div class="widget-summary-col">
                            <div class="summary">
                                <h4 class="title ml-55">New Articles</h4>
                            </div>
                        </div>
                    </div>
                    <div class="widget-summary">
                        <a href="#" class="quick-btn info light-purple">
                            <div class="summary-icon bg-purple-light mb-10"><i aria-hidden="true"
                                    class="fa fa-file-text"></i></div>
                            <br> <strong class="storyno">{{ $new }}</strong>
                        </a>
                    </div>
                </div>
            </section>
        </div>
        <div class="col-md-4">
            <section class="card card-featured-left card-featured-primary mbt-2">
                <div class="card-body brd1">
                    <div class="widget-summary">
                        <div class="widget-summary-col">
                            <div class="summary">
                                <h4 class="title text-left"><span class="summary-icon bg-green-light"><i aria-hidden="true"
                                            class="fa fa-file-text"></i></span> Published (Last 7 Days)</h4>
                            </div>
                        </div>
                    </div>
                    <div class="widget-summary"><a href="#" class="quick-btn info light-green"><strong
                                class="st1">By You</strong><br> <strong class="storyno">{{ $publishyou }}</strong></a>
                        <a href="#" class="quick-btn info light-green"><strong class="st1">By All</strong><br>
                            <strong class="storyno">{{ $publish }}</strong></a>
                    </div>
                </div>
            </section>
        </div>
        <div class="col-md-5">
            <section class="card card-featured-left card-featured-primary mbt-2">
                <div class="card-body brd1">
                    <div class="widget-summary">
                        <div class="widget-summary-col">
                            <div class="summary">
                                <h4 class="title text-left"><span class="summary-icon bg-light-blue"><i aria-hidden="true"
                                            class="fa fa-newspaper-o"></i></span> Today's Newsletters</h4>
                            </div>
                        </div>
                    </div>
                    {{-- <div class="widget-summary">
                        @if ($contentmorning == 1)
                            <a href="#" class="icons">Morning<br>Post<br><img
                                    src="{{ url('') }}/img/morning.png" alt="Morning Post" title="Morning Post"></a>
                        @endif
                        @if ($contentafternoon == 1)
                            <a href="#" class="icons">Afternoon<br>Post<br><img
                                    src="{{ url('') }}/img/afternoon-release.png" alt="Afternoon Post"
                                    title="Afternoon Post"></a>
                        @endif
                        @if ($contentevening == 1)
                            <a href="#" class="icons">Evening<br>Post<br><img
                                    src="{{ url('') }}/img/evening.png" alt="Evening Post" title="Evening Post"></a>
                        @endif
                        @if ($contentbreaking == 1)
                            <a href="#" class="icons">Breaking<br>News<br><img
                                    src="{{ url('') }}/img/breaking-news.png" alt="Breaking News"
                                    title="Breaking News"></a>
                        @endif
                        @if ($contentnewsupdate == 1)
                            <a href="#" class="icons">News<br>Update<br><img
                                    src="{{ url('') }}/img/newsupdate.png" alt="News Update" title="News Update"></a>
                        @endif
                        @if ($contentcustom == 1)
                            <a href="#" class="icons">Custom<br>Newsletter<br><img
                                    src="{{ url('') }}/img/custom-news.png" alt="Custom News" title="Custom News"></a>
                        @endif
                    </div> --}}
                </div>
            </section>
        </div>
    </div>
    <div class="box box-info">
        <div class="box-header card-header with-border">
            <h3 class="box-title"><i aria-hidden="true" class="fa fa-book"></i> Most Read Articles (Last 7 Days)</h3>
            <div class="box-tools pull-right"><button data-widget="collapse" class="btn btn-box-tool"><i
                        class="fa fa-minus"></i></button></div>
        </div>
        <div class="box-body">
            <table class="table table-condensed table-hover table-bordered custbl">
                <thead>
                    <tr>
                        <th>Article Id</th>
                        <th>Title</th>
                        <th>Pageviews</th>
                        <th>Publish Date</th>

                    </tr>
                </thead>
                <thead class="transparent-bg"></thead>
                <tbody>
                    @foreach ($mstread as $mst)
                        <tr id="view_93892">
                            <td><a target="_blank" href="{{ $mst->url }}"> {{ $mst->article_id }}</a></td>
                            <td>{{ $mst->title }}</td>
                            <td>{{ $mst->number_hits }}</td>
                            <td>{{ Carbon\Carbon::parse($mst->publish_date)->format('jS M Y') }}</td>

                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
    <div class="row">
        <div class="col-md-6">
            <section class="card card-featured-left card-featured-primary mbt-2">
                <div class="card-body brd1">
                    <div class="widget-summary">
                        <div class="widget-summary-col">
                            <div class="summary">
                                <h4 class="title text-left"><span class="summary-icon bg-green-light"><i aria-hidden="true"
                                            class="fa fa-users"></i></span> Top Authors (Last 30 Days)
                                </h4>
                            </div>
                        </div>
                    </div>
                    <div class="widget-summary">
                        <table class="table table-condensed table-hover table-bordered author">
                            <thead>
                                <tr>
                                    <th align="center" class="text-center">Author</th>
                                    <th align="center" class="text-center">Author Name</th>
                                    <th align="center" class="text-center">Total Articles</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($authors as $auth)
                                    <tr>
                                        <td><a href="#"><img
                                                    src="https://www.exchange4media.com/news-photo/album/{{ $auth->photo }}"
                                                    alt="" title=""></a></td>
                                        <td style="vertical-align: middle;">{{ $auth->name }}</td>
                                        <td style="vertical-align: middle;">{{ $auth->id }}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </section>
        </div>
        <div class="col-md-6">
            <section class="card card-featured-left card-featured-primary mbt-2">
                <div class="card-body brd1">
                    <div class="widget-summary">
                        <div class="widget-summary-col">
                            <div class="summary">
                                <h4 class="title text-left"><span class="summary-icon bg-green-light"><i aria-hidden="true"
                                            class="fa fa-line-chart"></i></span> Current Week Articles
                                    Chart</h4>
                            </div>
                        </div>
                    </div>
                    <div class="widget-summary">
                        <canvas id="canvas" height="420" width="500"></canvas>
                    </div>
                </div>
            </section>
        </div>
    </div>
    <div class="box box-info">
        <div class="box-header card-header with-border">
            <h3 class="box-title"><i aria-hidden="true" class="fa fa-bar-chart"></i> Reports by Categories(Last 30 Days)
            </h3>
            <div class="box-tools pull-right"><button data-widget="collapse" class="btn btn-box-tool"><i
                        class="fa fa-minus"></i></button></div>
        </div>
        <div class="box-body">
            {{-- {!! $chart->html() !!} --}}
        </div>
    </div>

    <div class="box box-info collapsed-box">
        <div class="box-header with-border">
            <h3 class="box-title">Log Activity</h3>
            <div class="box-tools pull-right">
                <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-plus"></i></button>
            </div>
            <!-- /.box tools -->
        </div>
        <!-- /.box-header -->
        <div class="box-body">
            {{-- {!! history()->render() !!} --}}
        </div>
        <!-- /.box-body -->
    </div>
    {{-- {!! Charts::scripts() !!}
    {!! $chart->script() !!} --}}
@endsection

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.3/js/bootstrap-select.min.js" charset="utf-8">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.bundle.js" charset="utf-8"></script>
<script>
    var url = "{{ url('admin/chart') }}";
    var Years = new Array();
    var Labels = new Array();
    var Prices = new Array();
    $(document).ready(function() {
        $.get(url, function(response) {
            response.forEach(function(data) {
                Years.push(data.day);
                Labels.push(data.count);
                Prices.push(data.count);
            });
            var ctx = document.getElementById("canvas").getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'bar',
                data: {
                    labels: Years,
                    datasets: [{
                        label: 'Story chart',
                        data: Prices,
                        borderWidth: 1
                    }]
                },
                options: {
                    scales: {
                        yAxes: [{
                            ticks: {
                                beginAtZero: true
                            }
                        }]
                    }
                }
            });
        });
    });
</script>