@model IEnumerable<Examagram.Entities.Candidate>
@{
    Layout = "~/Areas/Examiner/Views/Shared/_NewLayout.cshtml";
    ViewBag.Title = "Manage Candidates";
    ViewBag.MenuHighlight = Resources.MenuResources.ResourceManager.GetString("CandidatesMenuItem").Replace(" ", "");
    ViewBag.SubMenuHighlight = Resources.MenuResources.ResourceManager.GetString("ManageCandidatesMenuItem").Replace(" ", "");
}

<!-- Content Header (Page header) -->
<div class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-lg-6">
                <ol class="breadcrumb">
                    <li><i class="fas fa-clipboard-list"></i></li>
                    <li class="breadcrumb-item"> <a href="#">Candidates</a></li>
                    <li class="breadcrumb-item active">Manage Candidates</li>
                </ol>
            </div>
        </div><!-- /.Breadcrumb url -->
    </div>
</div>
<!-- /.content-header -->
<!-- Main content -->
<div class="content">
    <div class="container-fluid">
        <!-- Application form -->
        <div class="search-filter mt-5">
            <p class="heading-name">Search filter</p>
            <!-- Search Select with dropdown -->
            <div class="d-flex justify-content-around">
                <div class="group-filter d-flex align-items-center mx-2">
                    @if (ViewData["GroupID"] != null)
                    {
                        <label for="groupFilter">Group</label>
                        <div class="ml-3">
                            @Html.DropDownList("GroupID", null, "--Select--", new { @class = "form-control" })
                        </div>
                    }
                </div>
                <div class="group-filter d-flex align-items-center mx-2">
                    @if (ViewBag.Countries != null)
                    {
                        <label for="countryFilter">Country</label>
                        @Html.DropDownList("CountryID", (SelectList)ViewBag.Countries, "Select a Country", new { @class = "ml-3 form-control" })
                    }
                </div>
                <div class="group-status d-flex align-items-center mx-2">
                    <label for="countryFilter">Status</label>
                    <select class="ml-3 form-control" name="select" id="countryFilter">
                        <option value="0">--Select--</option>
                        <option value="1">Complete</option>
                        <option value="2">Pending</option>
                        <option value="3">Expired</option>
                    </select>
                </div>
                <div class="group-data-range d-flex align-items-center mx-2">
                    @if (ViewBag.Countries != null)
                    {
                        <label for="countryFilter">Country</label>
                        @Html.DropDownList("CountryID", (SelectList)ViewBag.Countries, "Select a Country", new { @class = "ml-3 form-control" })
                    }
                </div>
            </div>
            <!-- Buttons for filtering -->
            <div class="buttons d-flex justify-content-center mt-4">
                <button class="btn-primary mx-2">
                    <i class="fas fa-sort-amount-up"></i>
                    Filter
                </button>
                <button class="btn-secondary mx-2">
                    <i class="fas fa-sync-alt">
                        <a href="@Url.Action("ManageCandidates", "Candidate")" class="btn bs-tooltip" data-placement="bottom" data-original-title="Reset search filters">Reset Filter</a>
                    </i>
                </button>
            </div>
            <!-- Search field box -->
            <div class="search-field mt-4">
                <div class="row">
                    <div class="col-lg-8 mx-auto">
                        <div class="input-group mb-3">
                            <input id="txtName" type="text" class="form-control" placeholder="Recipient's username" aria-label="Recipient's username" aria-describedby="basic-addon2">
                            <div class="input-group-append">
                                <a href="#" id="aCandidateSearch" class="btn btn-primary bs-tooltip" data-placement="bottom" data-original-title="You can find candidates by using the search filters. Use the GROUP Filter to find the candidates assigned to that particular GROUP when they were created on the system. You can also filter by the country that the candidate is from. Finally, you can search for candidates by their name or e-mail address. This is the easiest way to find an individual candidate as all e-mail addresses are unique. More than one search filter can be applied at one time, so do not forget to use the clear filter button. NB only active candidates are shown in this section. The ‘show inactive candidates’ button will override this if you choose to look at inactive candidates. Click on this to show the inactive candidates."><i class="fas fa-search"></i>&nbsp;</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="divManageCandidates">
            @Html.Partial("_CandidateListPartial")
        </div>
        <!-- End of Search filter area -->
        <!-- Table for send tests -->

    </div>  <!-- /.container-fluid -->

</div> <!-- /.content -->

<style>
    a.btn.bs-tooltip {
        color: white;
        font-weight: 500;
        padding: 0px;
        margin: 0px 0px;
        font-size: 21px;
    }

    a#aCandidateSearch {
        width: 100%;
        height: 100%;
        background: #00ADB5 !important;
        align-items: center;
        justify-content: center;
        border-top-right-radius: 50px;
        border-bottom-right-radius: 50px;
    }

    i.fas.fa-search {
        line-height: 60px;
    }
</style>