@extends('admin.index')
@section('title', Helper::getSiteTitle('FAQs'))

@section('content')
<div class="row">
    <div class="col-12">
        <div class="page-title-box">
            <div class="page-title-right">
                <ol class="breadcrumb m-0">
                    <li class="breadcrumb-item"><a href="{{ route('admin-dashboard') }}">Dashboard</a></li>
                    <li class="breadcrumb-item active">FAQs</li>
                </ol>
            </div>
            <h4 class="page-title">FAQs</h4>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-12">
        <div class="card-box">
            <button class="btn btn-danger waves-effect waves-light float-right ml-5 d-none remove-all-button">
                <span class="btn-label"><i class="mdi mdi-delete"></i></span>
                {{ __('Remove') }}
            </button>
            <a href="{{ route('admin-create-faq') }}" class="btn btn-success waves-effect waves-light float-right">
                <span class="btn-label"><i class="fas fa-plus"></i></span>
                {{ __('Create New FAQ') }}
            </a>
            <h4 class="header-title mb-4">FAQs</h4>
            {!! Helper::getDatatables([__('Question'), __('Status'), __('Created At'), __('Action')], 1) !!}
        </div>
    </div>
</div>
@endsection

@section('js-lib')
<script src="{{ asset('admin/libs/datatables.net/js/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('admin/libs/datatables.net-bs4/js/dataTables.bootstrap4.min.js') }}"></script>
<script src="{{ asset('admin/libs/datatables.net-responsive/js/dataTables.responsive.min.js') }}"></script>
<script src="{{ asset('admin/libs/datatables.net-responsive-bs4/js/responsive.bootstrap4.min.js') }}"></script>
<script src="{{ asset('admin/libs/datatables.net-buttons/js/dataTables.buttons.min.js') }}"></script>
<script src="{{ asset('admin/libs/datatables.net-buttons-bs4/js/buttons.bootstrap4.min.js') }}"></script>
<script src="{{ asset('admin/libs/datatables.net-buttons/js/buttons.html5.min.js') }}"></script>
<script src="{{ asset('admin/libs/datatables.net-buttons/js/buttons.flash.min.js') }}"></script>
<script src="{{ asset('admin/libs/datatables.net-buttons/js/buttons.print.min.js') }}"></script>
<script src="{{ asset('admin/libs/datatables.net-keytable/js/dataTables.keyTable.min.js') }}"></script>
<script src="{{ asset('admin/libs/datatables.net-select/js/dataTables.select.min.js') }}"></script>
<script src="{{ asset('admin/libs/pdfmake/build/pdfmake.min.js') }}"></script>
<script src="{{ asset('admin/libs/pdfmake/build/vfs_fonts.js') }}"></script>
<script src="{{ asset('admin/libs/sweetalert2/sweetalert2.min.js') }}"></script>
<script src="{{ asset('admin/libs/select2/js/select2.min.js') }}"></script>
@endsection

@section('css-lib')
<meta name="remove-url" content="{{ route('admin-remove-faq') }}">
<meta name="class-to-open" content='faqs'>
<link href="{{ asset('admin/libs/datatables.net-bs4/css/dataTables.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('admin/libs/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('admin/libs/datatables.net-buttons-bs4/css/buttons.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('admin/libs/datatables.net-select-bs4/css/select.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('admin/libs/sweetalert2/sweetalert2.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('admin/libs/select2/css/select2.min.css') }}" rel="stylesheet" type="text/css" />
@endsection

@section('js')
<script type="text/javascript">
    function createTable()
    {
        table = $('.datatable').DataTable({
            language:{paginate:{previous:"<i class='mdi mdi-chevron-left'>",next:"<i class='mdi mdi-chevron-right'>"}},
            drawCallback:function(){$(".dataTables_paginate > .pagination").addClass("pagination-rounded")},
            "processing": true,
            "serverSide": true,
            "paging": true,
            "scrollX": false,
            "pageLength": 25,
            "language": {
                "emptyTable": "No faqs found"
            },
            "order": [[0, "desc"]],
            "ajax":
            {
                url: "{{ route('admin-faqs') }}",
                data: function ( d ) {},
                beforeSend: function(jqXHR) {},
                error: function(jqXHR, textStatus, errorThrown){},
                complete: function(jqXHR) {}
            },
            createdRow: function( row, full, dataIndex ) {

                if (full.is_active == 0) 
                {
                    $( row ).addClass('alert alert-danger');
                }
            },
            "columnDefs": [
                { className: "text-center", "targets": [ 2 ] },
                { className: "text-center", "targets": [ 3 ] },
                { className: "text-right", "targets": [ 4 ] },
            ],
            "columns":[
                {
                    sortable: false,
                    name: "id",
                    "render": function ( data, type, full, meta ) {

                        return '<div class="checkbox checkbox-single"><input type="checkbox" class="select-item-checkbox" value="'+ full.id +'"><label></label></div>';
                    }
                },
                { "data": "question", "name":"id" },
                { "data": "status", "name":"id", "sortable": false },
                { "data": "created_at", "name":"id", "sortable": false },
                { "data": "actions", "name":"id", "sortable": false },
            ] 
        });
    }
</script>
@endsection