@extends('dashboard.base')
@section('content')

<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>




<div class="container-fluid">
    <div class="animated fadeIn">
        <div class="row">
            <div class="col-sm-12 col-md-12 col-lg-12 col-xl-12">
                <div class="card">
                    <div class="card-header">

                        @if(session('success'))
                        <div class="alert alert-success alert-block">
                            <button type="button" class="close" data-dismiss="alert">×</button>
                            {!! session('success') !!}
                        </div>
                        @endif
                        @if ($message = Session::get('error'))
                        <div class="alert alert-success alert-block">
                            <button type="button" class="close" data-dismiss="alert">×</button>
                            {!! session('error') !!}
                        </div>
                        @endif
                        <!-- <i class="fa fa-align-justify"></i> -->
                      
                        <a href="{{ route('createInstitute') }}" class="btn btn-xs btn-info pull-right"
                            style="text-align:end">Add Institute</a>
                    </div>


                </div>
            </div>
        </div>
    </div>
</div>

<div class="card-body">
    <div class="container">
        <table class="table table-bordered display nowrap" id="institute">
            @csrf
            <thead>
                <tr>
                    <!-- <th>Sr no.</th> -->
                    <th>Name of the institution</th>
                    <th>Type</th>
                    <!-- <th>Total no. of enrollments</th> -->
                    <!-- <th>Date</th> -->
                    <th>Subscription Plan</th>
                    <th>Email</th>
                    <th>Contact no.</th>
                    <th>Admin</th>
                    <th> Created At</th>
                    <th>Action</th>
                </tr>
            </thead>

        </table>

    </div>

<link href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.min.css" rel="stylesheet">
<link href="https://cdn.datatables.net/responsive/2.2.4/css/responsive.dataTables.min.css" rel="stylesheet">


<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/responsive/2.2.4/js/dataTables.responsive.min.js">

</script>
<script>
$(function() {
    let table = $('#institute').DataTable({
        //processing: true,
        // serverSide: true,
        responsive: true,
        columnDefs: [ {
            className: 'dtr-control',
            orderable: false,
            targets:   0
        } ],
         
        

        ajax: "{{ route('index') }}",
        columns: [
            // {
            //     data: 'DT_RowIndex',
            //     name: 'DT_RowIndex'
            // },
            {
                data: 'institute_name',
                name: 'institute_name'
            },
            {
                data: 'institute_type',
                name: 'institute_type'
            },
            {
                data: 'subscription_type',
                name: 'subscription_type'
            },
            {
                data: 'institute_email',
                name: 'institute_email'
            },
            {
                data: 'institute_contact',
                name: 'institute_contact'
            },
            {
                data: 'admin',
                name: 'admin'
            },
            {
                data: 'created_at',
                name: 'created_at'
            },
            {
                data: 'action',
                name: 'action',
                orderable: false,
                searchable: false
            }
        ]
    });

});
</script>
</div>
@endsection
@section('javascript')
@endsection