<div class="row">
    <div class="col-md-12 mt-2">
      <div class="row justify-content-between">
        <div class="col-md-3">
            
            <div class="card w-50 mb-2"><a href="/coach/list" class="btn btn-sm btn-info m-1"><i class="fas fa-long-arrow-alt-left"></i> Back</a></div>
          </div>
        <div class="col-md-3">
            
          <div class="card w-50 float-right mb-2"><a href="/coach/<%=user_id %>/plan-add" class="btn btn-sm btn-info m-1"><i
                class="fas fa-plus"></i> Add Plan</a></div>
        </div>
      </div>
      <div class="card card-info">
        <div class="card-header">
          <h3 class="card-title"><%=sectionTitle%></h3>
        </div>
        <div class="card-body table-responsive">
          <table class="table table-hover table-head-fixed datatable123">
            <thead>
              <tr>
                <th style="width: 1%">#</th>
                <th>Plan name</th>
                <th>Plan Cost($)</th>
                <th data-orderable="false">Plan Image</th>
                <th>Approval Status</th>
                <th data-orderable="false">Actions</th>
              </tr>
            </thead>
            <tbody>
             
              <% if (dataList.length>0){ %>
                <% let index=((page-1)*limit)+1;%>
                <% for (data of dataList){ %>
              <tr>
                <td><%=index++%></td>
                <td><%= data?.plan_name %></td>
                <td><%= data.plan_cost %></td>
                <td>
                  <%if(data.plan_image !=null && data.plan_image !="" ){%>
                  <img
                    class="img-thumbnail"
                    style="width: 50px"
                    src="/uploads/user/plans/<%=data.plan_image %>"
                    alt="Image"
                  />
                  <%}else{%>
                  <img
                    class="img-thumbnail"
                    style="width: 50px"
                    src="/images/no-image.jpg%>"
                    alt="Image"
                  />
                  <%}%>
                </td>
                <td>
                  <% if(data.active_status){%>
                  <span class="badge badge-success" style="font-size: 12px"
                    >Active</span
                  >
                  <%}else{%>
                  <span
                    class="badge badge-danger"
                    style="cursor: pointer; font-size: 12px"
                  >
                    Inactive
                  </span>
                  <%}%>
                </td>
                <td>
                  <a
                    class="btn btn-info btn-sm mr-2"
                    href="/coach/<%=data.user_id%>/plan-edit/<%=data.id%>"
                    data-toggle="tooltip"
                    title="Edit"
                  >
                    <i class="fas fa-pencil-alt"> </i>
                  </a>
                  <a
                    class="btn btn-danger btn-sm"
                    id="delete_<%=data._id%>"
                    onclick="deleteDataFunc(`<%=data._id%>`,`coach/plan-delete/<%=data.id%>`)"
                    data-toggle="tooltip"
                    title="Delete"
                  >
                    <i class="fas fa-trash"> </i>
                  </a>
                </td>
              </tr>
              <% } %>
              <% }else{ %>
                <tr >
                  <td  style="text-align: center;">
                   
                  </td>
                  <td  style="text-align: center;">
                    
                   </td> <td  style="text-align: center;">
                   
                   </td> <td  style="text-align: center;">
                    No Data Found
                   </td> <td  style="text-align: center;">
                   
                   </td> <td  style="text-align: center;">
                   
                   </td> 
                </tr>
                <% } %>
                
            </tbody>
          </table>
          <% if (dataList.length>0){ %>
            <div class="col-sm-12 col-md-7 pl-0" >
              <div class="dataTables_paginate paging_simple_numbers" id="DataTables_Table_0_paginate">
                <ul class="pagination">
                  <li class="paginate_button page-item previous <%=page==1?'disabled':''%>" id="DataTables_Table_0_previous"><a href="/coach/list?page=<%=page-1%>"
                      aria-controls="DataTables_Table_0" aria-disabled="true" role="link" data-dt-idx="previous"
                      tabindex="0" class="page-link">Previous</a></li>
                    <%for(let i=1;i<=totalpage;i++){%>
                      <li class="<%=i==page?'paginate_button page-item active':'paginate_button page-item'%>"><a href="/coach/list?page=<%=i%>" aria-controls="DataTables_Table_0" role="link"
                        aria-current="page" data-dt-idx="0" tabindex="0" class="page-link"><%=i%></a></li>
                      <%}%>
                  <li class="paginate_button page-item next <%=page==totalpage?'disabled':''%>" id="DataTables_Table_0_next"><a href="/coach/list?page=<%=+page+1%>"
                      aria-controls="DataTables_Table_0" role="link" data-dt-idx="next" tabindex="0"
                      class="page-link">Next</a></li>
                </ul>
              </div>
            </div>
            <% } %>
        </div>
      </div>
      <!-- /.card -->
    </div>
    <!-- /.col -->
    <script>
      $(document).ready(function () {
         $('.datatable123').DataTable({
  
           paging: false,         // Enable pagination
     lengthChange: false,
     searching: false,
     ordering: true,
     info: false,
     autoWidth: false,
  
         })
       })
  
    </script>
  </div>
  <!-- /.row -->
  
  