@extends('adminlte::page')

@section('title', 'Forum Comments')

@section('content_header')
    <h1>Forum Comments</h1>
@stop

@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="box">
                <div class="box-header with-border">
                <form action="{{ route('admin.forum-comment.index') }}" method="get" id="searchForm">
                    <div class="row">
                        <div class="form-group col-md-4">
                            <label for="topic">Topic</label>
                            <input type="text" class="form-control" id="topic" name="topic" placeholder="Topic" value="{{ request()->input('topic') }}">
                        </div>
                        <div class="form-group col-md-3">
                            <label for="username">Username</label>
                            <input type="text" class="form-control" id="username" name="username" placeholder="Username" value="{{ request()->input('username') }}">
                        </div>
                        <div class="form-group col-md-2" style="margin-top:30px;">
                            <button type="submit" class="btn btn-primary mb-3" title="search comment">Search</button>
                        </div>
                    </div>
                    
                </form>
                
                <div class="box-header with-border mb-3 text-right">
                    <span>
                        <a href="{{ route('admin.forum-comment.add') }}" class="btn btn-primary" title="add comment">+ Add Comment</a>
                    </span>
                </div>
                <!-- /.box-header -->
                <div class="box-body table-responsive">

                    <table class="table table-bordered">
                        <tr>
                            <th>Category</th>
                            <th>Topic Name</th>
                            <th>User Name</th>
                            <th>Comment</th>
                            <th>Date</th>
                            <th>approve</th>
                            <th>Action</th>
                        </tr>
                        @if(!empty($forumComments))
                            @foreach ($forumComments as $forumComment)
                                <tr id="tr_{{$forumComment->id}}">
                                    <td style="width:13%">{{optional($forumComment->forum?->category)->name ?? "N/A"}}</td>
                                    <td style="width:25%">{{$forumComment->forum?->topic}}</td>
                                    <td style="width:10%">{{ blank($forumComment->user->name) ? $forumComment->user->email : $forumComment->user->name }}</td>
                                    <td style="width:25%">{!! \Illuminate\Support\Str::words(strip_tags($forumComment->comment), 8, ' ...') !!}</td>
                                    <td style="width:10%">@if($forumComment->date != "" and $forumComment->date != null) {{date("d-m-Y H:i",strtotime($forumComment->date))}} @endif</td>
                                    <td style="width:6%"><input type="checkbox" {{$forumComment->is_active?'checked':''}} class="chk_recent" data-url="{{ route('admin.forum-comment.updateIsactive',$forumComment->id) }}"/></td>
                                    <td style="width:7%">
                                        <a href="{{route('admin.forum-comment.edit',$forumComment->id)}}"><i class="fas fa-edit text-info"></i></a>
                                        <a href="{{route('admin.forum-comment.delete',$forumComment->id)}}" onclick="return confirm('Are you sure?')" class="ml-2"><i class="fas fa-trash text-danger"></i></a>
                                    </td>
                                </tr>
                            @endforeach
                        @endif
                    </table>
                </div>
                <!-- /.box-body -->

                <div class="box-footer clearfix">
                    {{ $forumComments->withQueryString()->links('pagination::bootstrap-4') }} 
                </div>
            </div>
        </div>
        <!-- /.col -->
    </div>
@section('js')
    <script type="text/javascript">
        $(document).ready(function () {
            $('.chk_recent').change(function (e) {
                var featured = 0; 
                if ($(this).is(':checked')) {
                    featured = 1;
                }
                $.ajax({
                    url: $(this).attr('data-url'),
                    data: {featured: featured},
                    type: "GET",
                    success: function (data) {
                        data = JSON.parse(data);
                        if (data['error'] == true) {
                            new PNotify({
                                title: 'Alert',
                                text: data['message'],
                                type: 'error',
                                styling: 'bootstrap3',
                                delay: 3000
                            });
                        } else {
                            new PNotify({
                                title: 'Alert',
                                text: data['message'],
                                type: 'success',
                                styling: 'bootstrap3',
                                delay: 3000
                            });
                        }
                    }
                });
            });

            $(document).on('confirm', function (e) {
                var ele = e.target;
                e.preventDefault();
                $.ajax({
                    url: ele.href,
                    type: 'DELETE',
                    headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                    success: function (data) {
                        if (data['success']) {
                            $("#" + data['tr']).slideUp("slow");
                            alert(data['success']);
                        } else if (data['error']) {
                            alert(data['error']);
                        } else {
                            alert('Whoops Something went wrong!!');
                        }
                    },
                    error: function (data) {
                        alert(data.responseText);
                    }
                });
                return false;
            });
        });
    </script>
@stop

@stop