@php($title =__('episodes') )
<x-dashboard.layouts.app :title="$title">
    <!-- start page title -->
    <x-dashboard.breadcrumb :title="$title">
<!--        <li class="breadcrumb-item"><a href="javascript: void(0);">{!! $title !!}</a></li>-->
    </x-dashboard.breadcrumb>
    <!-- end page title -->
    <div class="card card-box pd-30 height-100-p mb-4">
        <div class="card-body">
            <div class="d-sm-flex flex-wrap">
                <h4 class="card-title mb-4">{!! $title !!}</h4>
                <div class="ms-auto"></div>
            </div>
            {!! $dataTable->table() !!}
        </div>
    </div>
    <!-- end row -->
    <x-slot name="js">
        <script src="{{ asset('vendor/datatables.net/js/jquery.dataTables.min.js') }}"></script>
        <script src="{{ asset('vendor/datatables.net-bs4/js/dataTables.bootstrap4.min.js') }}"></script>

        <script src="{{ asset('vendor/datatables.net-buttons/js/dataTables.buttons.min.js') }}"></script>
        <script src="{{ asset('vendor/datatables.net-buttons-bs4/js/buttons.bootstrap4.min.js') }}"></script>
        <script src="{{ asset('vendor/jszip/jszip.min.js') }}"></script>
        <script src="{{ asset('vendor/pdfmake/build/pdfmake.min.js') }}"></script>
        <script src="{{ asset('vendor/pdfmake/build/vfs_fonts.js') }}"></script>

        <script src="{{ asset('vendor/datatables.net-buttons/js/buttons.html5.min.js') }}"></script>
        <script src="{{ asset('vendor/datatables.net-buttons/js/buttons.print.min.js') }}"></script>
        <script src="{{ asset('vendor/datatables.net-buttons/js/buttons.colVis.min.js') }}"></script>

        <script src="{{ asset('vendor/datatables/buttons.server-side.js') }}"></script>
        {!! $dataTable->scripts() !!}
    </x-slot>
</x-dashboard.layouts.app>