@model IEnumerable<RoleViewModel>

@{
    ViewData["Title"] = "Index";
}



<div class="container mt-5">
    <partial name="_Notification" />

    <div class="card bg-default mb-3">
        <div class="card-header">Roles</div>
        <div class="card-body">
            <p>
                <a asp-action="Create" class="btn btn-primary">Create New</a>
            </p>
            <h4 class="card-title">Roles List</h4>
            <form asp-action="DeleteMultiple" method="post">
                <table class="table table-responsive w-100 d-block d-md-table">
                    <thead class="w-100">
                        <tr>
                            <th>
                                <input type="checkbox" onclick="selectAll(this)" title="Select/Deselect All" />
                            </th>
                            <th>Role Name</th>
                            <th class="text-end">Action</th>
                        </tr>
                    </thead>
                    <tbody class="w-100">
                        @foreach (var item in Model)
                        {
                            <tr>
                                <td><input type="checkbox" name="selectedRoles" value="@item.Id" /></td>
                                <td>@item.Name</td>
                                <td class="text-end">
                                    <a asp-action="Edit" asp-route-id="@item.Id" class="btn btn-info btn-sm">Edit</a>
                                </td>
                            </tr>
                        }
                    </tbody>
                </table>
                <button type="submit" class="btn btn-danger" onclick="return confirm('Are you sure you want to delete the selected roles?');">Delete Selected</button>
            </form>
        </div>
    </div>
</div>

@section Scripts {
    <script>
        function selectAll(source) {
            checkboxes = document.querySelectorAll('input[name="selectedRoles"]');
            for (var i = 0; i < checkboxes.length; i++) {
                checkboxes[i].checked = source.checked;
            }
        }
    </script>
}