{% extends 'professor_dashboard.html' %}
{% block body %}
<div class="row align-items-center d-flex  justify-content-center">
    <div class="col-12 mb-4">
        <div class="card border-light shadow-sm components-section align-items-center d-flex  justify-content-center">
            <div class="card-body align-items-center d-flex justify-content-center">     
                <div class="row mb-4">
                    {% if(data is not none and data) %}
    <div class="col-lg-12 col-sm-16">
        <h3 class="h3 text-center">STUDENT RESULTS</h3>  
      </div>
        <div class="table-responsive">
            <table id="example" class="display nowrap" style="width:100%">
                <thead class="thead-light">
        <tr>
            <th scope="col">Name</th>
            <th scope="col">Email</th>
            <th scope="col">Marks</th>
        </tr>
    </thead>
    <tbody>
        {% for result in data %}
            <tr>
                <td>{{result['name']}}</td>
                <td>{{result['email']}}</td>
                <td>{{result['marks']}}</td>
            </tr>
        {% endfor %}
    </tbody>
</table>
                            </div>
                            {% else %}
                            <div class="col-lg-12 col-sm-16">
                                <center><lottie-player src="https://assets7.lottiefiles.com/datafiles/vhvOcuUkH41HdrL/data.json"  background="transparent"  speed="1"  style="width: 300px; height: 300px;"  loop  autoplay></lottie-player></center>
                                <h3 class="h3 text-center">
                                    No Records Found!
                                </h3>  
                              </div>
                            {% endif %}
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script>
    $(document).ready(function() {
    $('#example').DataTable( {
        dom: 'Bfrtip',
        buttons: [
            'copy', 'csv', 'excel', 'pdf', 'print'
        ]
    } );
} );
</script>
{% endblock %}