blazor-saas-hrm/Features/Organization/Employee/Components/_EmployeeIncomeUpdateForm.razor

@using Indotalent.Features.Organization.Employee
@using Indotalent.Features.Organization.Employee.Cqrs
@using MudBlazor
@inject EmployeeService EmployeeService
@inject ISnackbar Snackbar

<style>
    .field-label { font-size: 13px; font-weight: 700; color: #424242; margin-bottom: 4px; display: block; }
    .section-header { font-weight: 800; color: #0D47A1; letter-spacing: 0.5px; margin-bottom: 8px; }
</style>

<MudDialog>
    <TitleContent>
        <MudText Typo="Typo.h6">
            <MudIcon Icon="@Icons.Material.Filled.Edit" Class="mr-3 mb-n1" />
            Edit Employee Income
        </MudText>
    </TitleContent>
    <DialogContent>
        @if (_isLoading)
        {
            <div class="d-flex flex-column align-center pa-10">
                <MudProgressCircular Color="Color.Primary" Indeterminate="true" />
                <MudText Class="mt-4">Fetching Details...</MudText>
            </div>
        }
        else
        {
            <MudForm @ref="_form">
                <MudStack Spacing="4">
                    <MudGrid Spacing="3">
                        <MudItem xs="12"><div class="section-header">UPDATE INCOME DETAILS</div><MudDivider /></MudItem>
                        
                        <MudItem xs="12">
                            <label class="field-label">Income Component</label>
                            <MudTextField Value="@_incomeName"
                                          Variant="Variant.Outlined"
                                          Margin="Margin.Dense"
                                          ReadOnly="true"
                                          Disabled="true"
                                          Adornment="Adornment.Start"
                                          AdornmentIcon="@Icons.Material.Filled.Lock" />
                        </MudItem>

                        <MudItem xs="12">
                            <label class="field-label">Amount</label>
                            <MudNumericField @bind-Value="_model.Amount"
                                             Required="true"
                                             Variant="Variant.Outlined"
                                             Margin="Margin.Dense"
                                             Format="N0"
                                             Adornment="Adornment.Start"
                                             AdornmentIcon="@Icons.Material.Filled.Payments"
                                             AdornmentColor="Color.Success" />
                        </MudItem>

                        <MudItem xs="12">
                            <label class="field-label">Description</label>
                            <MudTextField @bind-Value="_model.Description"
                                          Variant="Variant.Outlined"
                                          Margin="Margin.Dense"
                                          Lines="2" />
                        </MudItem>

                        <MudItem xs="12">
                            <MudCheckBox @bind-Value="_model.IsActive"
                                         Label="Keep this component active"
                                         Color="Color.Primary"
                                         Dense="true" />
                        </MudItem>
                    </MudGrid>
                </MudStack>
            </MudForm>
        }
    </DialogContent>
    <DialogActions>
        <MudButton OnClick="Cancel" Variant="Variant.Outlined" Style="border: 1px solid #e0e0e0; border-radius: 4px; text-transform: none; font-weight: 700;">Cancel</MudButton>
        <MudButton Color="Color.Primary"
                   Variant="Variant.Filled"
                   OnClick="Submit"
                   Disabled="_processing || _isLoading"
                   Style="border-radius: 4px; text-transform: none; font-weight: 700;">
            @if (_processing)
            {
                <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
                <MudText Class="ms-2">Updating...</MudText>
            }
            else
            {
                <MudText>Update Changes</MudText>
            }
        </MudButton>
    </DialogActions>
</MudDialog>

@code {
    [CascadingParameter] IMudDialogInstance MudDialog { get; set; } = default!;
    [Parameter] public string Id { get; set; } = string.Empty;

    private MudForm? _form;
    private UpdateEmployeeIncomeRequest _model = new();
    private string _incomeName = string.Empty;
    private bool _isLoading = true;
    private bool _processing = false;

    protected override async Task OnInitializedAsync()
    {
        await LoadData();
    }

    private async Task LoadData()
    {
        _isLoading = true;
        var response = await EmployeeService.GetEmployeeIncomeByIdAsync(Id);
        if (response?.IsSuccess == true && response.Value != null)
        {
            var data = response.Value;
            _model.Id = data.Id;
            _model.IncomeId = data.IncomeId;
            _model.Amount = data.Amount;
            _model.Description = data.Description;
            _model.IsActive = data.IsActive;
            _incomeName = data.IncomeName; 
        }
        _isLoading = false;
    }

    private async Task Submit()
    {
        await _form!.Validate();
        if (!_form.IsValid) return;

        _processing = true;
        try
        {
            var res = await EmployeeService.UpdateEmployeeIncomeAsync(_model);
            await Task.Delay(500);
            if (res?.IsSuccess == true)
            {
                Snackbar.Add("Income updated successfully", Severity.Success);
                MudDialog.Close(DialogResult.Ok(true));
            }
        }
        finally
        {
            _processing = false;
        }
    }

    private void Cancel() => MudDialog.Cancel();
}