<div class="row">
    <div class="col-md-12 mt-3">
        <div class="row">
            <div class="col-md-3 offset-md-9">
                <div class="card w-50 float-right"><a href="/role/add" class="btn btn-sm btn-info m-1"><i
                            class="fas fa-plus"></i> Add Role</a>
                </div>
            </div>
        </div>
        <div class="card">
            <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 datatable">
                    <thead>
                        <tr>
                            <th style="width: 1%">
                                #
                            </th>
                            <th>
                                Role Name
                            </th>
                            <th>
                                Description
                            </th>
                            <th>
                                Status
                            </th>
                            <th data-orderable="false">
                                Action
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        <% let index=1;%>
                            <% for (data of dataList){ %>
                                <tr>
                                    <td>
                                        <%=index++%>
                                    </td>
                                    <td>
                                        <%= data.roleDisplayName %>
                                    </td>
                                    <td>
                                        <%= data.desc %>
                                    </td>
                                    <td>
                                        <% if(data.active_status){%>
                                            <span class="badge badge-primary">Active</span>
                                            <%}else{%>
                                                <span class="badge badge-danger">Inactive</span>
                                                <%}%>
                                    </td>
                                    <td>
                                        <a class="btn btn-info btn-sm mr-2" href="/role/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%>`,`role/delete/<%=data._id%>`)"
                                            data-toggle="tooltip" title="Delete">
                                            <i class="fas fa-trash">
                                            </i>
                                        </a>
                                    </td>
                                </tr>
                                <% } %>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<%- contentFor('pageModalSection')%>
    <%- contentFor('pageScriptsSection')%>