
<div class="container">
    <div class="col-md-11" >

        <table class="table table-sm table-responsive-sm table-hover text-nowrap table-responsive-sm  table-striped table-bordered display" style="margin-left:11%;"  id="table_id" border='2' align="center"  style="width:100%">
            <thead class="thead-dark">
                <tr style="text-align: center;">

                    <th>View</th>
                    <th>S.N</th>
                    <th>Name</th>

                    <th>Email</th>
                    <th>Conact No</th>
                    <th>Created At </th>

                    <th>Action</th>



                </tr>
            </thead>
            <tbody id="get_table_body">

                {% for customer in customers %}<!--This customers should be the data of pagination-->
                <tr>

                    <td><a href="{% url 'customer_app:view' customer.id %}" class="btn btn-primary btn-sm"><i
                                class="fa fa-eye"></i></a></td>
                    <td>{{customer.id}}</td>
                    <td>{{customer.name}} </td>
                    <td>{{customer.email}}</th>
                    <td>{{customer.contact}}</td>
                    <td>{{customer.date_created}}</td>
                    <td>
                        <button type="button" data-cid="{{customer.id}}" data-target="#AddCustomer" data-toggle="modal" class="btn btn-success btn-sm btn-edit ">
                            <i class="fas fa-edit"></i></button>
            
                        
                            <button type="button" data-cid="{{customer.id}}"
                                class="ml-1 btn btn-danger btn-sm btn-del"><i
                                    class="fas fa-trash-alt"></i></button>
                       
            
                            <a href="{% url 'order_app:create' customer.id %}" class="btn btn-success btn-sm">
                                <i class="fas fa-plus"></i>
                            </a>
                          
            
                    </td>
                </tr>
                {% empty %}
                <tr>
                    <td colspan="7" class=" text-center alert alert-danger">No Product Found</td>
                </tr>
            
                {% endfor %}
            
            </tbody>
        </table>



        



      

{% include 'includes/pagination.html' %}

      

    </div>
</div>
