BlazorSynchFusionCrm/BlazorSyncfusionCrm/Client/Pages/EditContact.razor

@page "/contacts/edit/{id:int}"
@page "/contacts/new"
@inject HttpClient Http
@inject NavigationManager NavigationManager

@if (Id is not null)
{
    <h3>Edit @contact.NickName</h3>
}
else
{
    <h3>Create a new contact</h3>
}

<div>
    <EditForm Model="contact" OnValidSubmit="HandleSubmit">
        <DataAnnotationsValidator />
        <SfTextBox CssClass="e-outLine" Placeholder="First Name"
                   FloatLabelType="@FloatLabelType.Auto" @bind-Value="contact.FirstName" />
        <SfTextBox CssClass="e-outLine" Placeholder="Last Name"
                   FloatLabelType="@FloatLabelType.Auto" @bind-Value="contact.LastName" />
        <SfTextBox CssClass="e-outLine" Placeholder="Nick Name"
                   FloatLabelType="@FloatLabelType.Auto" @bind-Value="contact.NickName" />
        <ValidationMessage For="(() => contact.NickName)" />
        <SfTextBox CssClass="e-outLine" Placeholder="Place"
                   FloatLabelType="@FloatLabelType.Auto" @bind-Value="contact.Place" />        
        <SfDatePicker TValue="DateTime?" Placeholder="Date of Birth"
                   FloatLabelType="@FloatLabelType.Auto" @bind-Value="contact.DateOfBirth"
                   Format="yyyy-MM-dd"/>
        <hr />
        <SfButton CssClass="e-primary" IconCss="e-icons e-save" Content="Save" type="submit" />
    </EditForm>
    <p>
        <SfMessage Severity="MessageSeverity.Success" Visible="showSuccessMessage">
            Contact saved successfully.
        </SfMessage>
        <SfMessage Severity="MessageSeverity.Error" Visible="showErrorMessage">
            Oops, something went wrong.
        </SfMessage>
    </p>
    @if(Id is not null)
    {
        <h3>Notes</h3>
        <SfTextBox CssClass="e-outline" Placeholder="New Note" Multiline="true" 
            FloatLabelType="@FloatLabelType.Auto" @bind-Value="newNote.Text"></SfTextBox>
        <SfButton CssClass="e-inherit" Content="Add Note" OnClick="CreateNote" ></SfButton>
        <hr />
        <p>
            <SfButton IsPrimary="true" Content="Load All Notes" OnClick="LoadNotes"></SfButton>
            @foreach(var note in notes)
            {
                <SfCard>
                    <CardHeader Title="@note.DateCreated.ToString()"></CardHeader>
                    <CardContent Content="@note.Text"></CardContent>
                    <CardFooter>
                        <CardFooterContent>
                            <SfButton
                                Content ="Delete"
                                IsPrimary ="true"
                                OnClick="@(() => DeleteNote(note.Id))" 
                            ></SfButton>  
                        </CardFooterContent>
                    </CardFooter>
                </SfCard>
                <br />
            }
        </p>
    }

</div>


@code {
    [Parameter]
    public int? Id { get; set; }

    public Contact contact { get; set; } = new Contact();
    public List<Note> notes { get; set; } = new List<Note>();
    public Note newNote { get; set; } = new Note { Text = string.Empty };

    bool showSuccessMessage = false;
    bool showErrorMessage = false;

    protected override async Task OnInitializedAsync()
    {
        if(Id is not null)
        {
            var result = await Http.GetAsync($"api/contacts/{Id}");
            if (result.IsSuccessStatusCode)
            {
                var jsonResult = await result.Content.ReadFromJsonAsync<Contact>();
                if (jsonResult is not null)
                    contact = jsonResult;
            }
            else
            {
                NavigationManager.NavigateTo("/contacts/new");
            }
        }
    }

    async Task HandleSubmit()
    {
        HttpResponseMessage result;
        if (Id is not null)
            result = await Http.PutAsJsonAsync($"api/contacts/{contact.Id}", contact);
        else
            result = await Http.PostAsJsonAsync($"api/contacts/", contact);

        if (result.IsSuccessStatusCode)
        {
            var jsonResult = await result.Content.ReadFromJsonAsync<Contact>();
            if(jsonResult is not null)
            {
                contact = jsonResult;
                showSuccessMessage = true;
            }
        }
        else
        {
            showErrorMessage = true;
        }
    }

    async Task CreateNote()
    {
        if (Id is null)
            return;

        newNote.ContactId = Id;
        var result = await Http.PostAsJsonAsync($"api/notes", newNote);
        if (result.IsSuccessStatusCode)
            await LoadNotes();
    }

    async Task DeleteNote(int noteId)
    {
        var result = await Http.DeleteFromJsonAsync<List<Note>>($"api/notes/{noteId}");
        if (result is not null)
            notes = result;
    }

    async Task LoadNotes()
    {
        var result = await Http.GetFromJsonAsync<List<Note>>($"api/notes/{contact.Id}");
        if (result is not null)
            notes = result;
    }
}