Newer
Older
hypermedia-blazorcrud / Blazorcrud.Client / Pages / Person / List.razor
@Derek Comartin Derek Comartin on 12 Jul 5 KB Init
@page "/person/{Page}"
@inject Services.IPersonService PersonService
@inject Services.IUserService UserService
@inject Microsoft.AspNetCore.Components.NavigationManager UriHelper
@inject Blazorcrud.Client.Shared.PageHistoryState PageHistoryState

<h1>People</h1>
<br/>

<div class="row mb-3">
    <div class="col-md-7">
        @if(LoggedIn)
        { 
            <NavLink href="/person/createperson" class="btn btn-sm btn-success mb-2">Add Person</NavLink>
        }
    </div>
    <div class="input-group col-md-5 text-md-right">
        <input name="PersonSearchInput" type="text" class="form-control" placeholder="Person Name" @bind="this.SearchTerm" @onkeyup="SearchBoxKeyPress" />
        <div class="input-group-btn">
            <button name="PersonSearchButton" class="btn btn-default" @onclick="SearchClick">
                <i class="oi oi-magnifying-glass" title="search" aria-hidden="true"></i>
            </button>
        </div>
        <div class="input-group-btn">
            <button name="PersonSearchClear" class="btn btn-default" @onclick="ClearSearch">
                <i class="oi oi-x" title="clear" aria-hidden="true"></i>
            </button>
        </div>
    </div>
</div>

@if (people == null)
{
    <p><em>Loading...</em></p>
}
else
{
    <table class="table table-striped">
        <thead>
            <tr>
                <th style="width:25%">First Name</th>
                <th style="width:25%">Last Name</th>
                <th style="width:15%">Gender</th>
                <th style="width:30%">Phone Number</th>
                <th style="width:5%"></th>
            </tr>
        </thead>
        <tbody>
            @foreach (var person in people.Results)
            {
                <tr>
                    <td>@person.FirstName</td>
                    <td>@person.LastName</td>
                    <td>@person.Gender</td>
                    <td>@person.PhoneNumber</td>
                    <td style="white-space: nowrap">
                        <NavLink href="@($"/person/viewperson/{person.PersonId}")" class="oi oi-eye text-primary mr-3 nounderline"></NavLink>
                        @if (LoggedIn)
                        {
                            <NavLink href="@($"/person/updateperson/{person.PersonId}")" class="oi oi-pencil text-warning mr-2 nounderline"></NavLink>
                            
                                @if (person.IsDeleting) 
                                {
                                    <button @onclick="@(() => DeletePerson(person))" disabled="@person.IsDeleting" class=" btn btn-link oi oi-trash text-danger mr-1 nounderline">
                                        <span class="spinner-border spinner-border-sm"></span>
                                    </button>
                                }
                                else
                                {
                                    <button @onclick="@(() => DeletePerson(person))" disabled="@person.IsDeleting" class=" btn btn-link oi oi-trash text-danger mr-1 nounderline">
                                        <span></span>
                                    </button>
                                }
                        }
                    </td>
                </tr> 
            }
        </tbody>
    </table>
    <Pager Result=@people PageChanged=PagerPageChanged />
}

@code {
    [Parameter]
    public string Page { get; set;} = "1";
    [Parameter]
    public string SearchTerm { get; set; } = string.Empty;
    protected PagedResult<Person> people;
    
    public bool LoggedIn
    {
        get {return UserService.User != null;}
    }
    
    protected override void OnInitialized()
    {
        PageHistoryState.AddPageToHistory(UriHelper.Uri);
        base.OnInitialized();
    }
    
    protected override async Task OnParametersSetAsync()
    {
        people = await PersonService.GetPeople(null, Page);
        PageHistoryState.AddPageToHistory(UriHelper.Uri);
    }

    protected async Task SearchBoxKeyPress(KeyboardEventArgs ev)
    {
        if (ev.Key == "Enter")
        {
            await SearchClick();
        }
    }

    protected async Task SearchClick()
    {
        if (string.IsNullOrEmpty(SearchTerm))
        {
            people = await PersonService.GetPeople(null, Page);
            return;
        }
        people = await PersonService.GetPeople(SearchTerm, Page);
        StateHasChanged();
    }

    protected async Task ClearSearch()
    {
        SearchTerm = string.Empty;
        people = await PersonService.GetPeople(SearchTerm, Page);
        PageHistoryState.AddPageToHistory(UriHelper.Uri);
        StateHasChanged();
    }

    protected void PagerPageChanged(int page)
    {
        UriHelper.NavigateTo("/person/" + page);
        PageHistoryState.AddPageToHistory(UriHelper.Uri);
    }

    private async void DeletePerson(Person _person)
    {
        var person = _person;
        person.IsDeleting = true;
        await PersonService.DeletePerson(person.PersonId);
        people = await PersonService.GetPeople(null, Page);
        StateHasChanged();
    }
}