initial commit

Features/Sales/CreditNote/Components/CreditNotePage.razor

@@ -0,0 +1,51 @@
+@page "/sales/credit-note"
+@using Indotalent.Features.Sales.CreditNote.Cqrs
+@using Indotalent.Features.Sales.CreditNote.Components
+@using MudBlazor
+
+@if (_currentView == ViewMode.Create)
+{
+    <_CreditNoteCreateForm OnCancel="BackToTable" OnSuccess="HandleSuccess" />
+}
+else if (_currentView == ViewMode.Update || _currentView == ViewMode.View)
+{
+    <_CreditNoteUpdateForm Data="_selectedData!"
+                           ReadOnly="@(_currentView == ViewMode.View)"
+                           OnCancel="BackToTable"
+                           OnSuccess="HandleSuccess" />
+}
+else
+{
+    <_CreditNoteDataTable OnAdd="() => ShowCreate()"
+                          OnEdit="(item) => ShowUpdate(item, false)"
+                          OnView="(item) => ShowUpdate(item, true)" />
+}
+
+@code {
+    private enum ViewMode { Table, Create, Update, View }
+    private ViewMode _currentView = ViewMode.Table;
+    private UpdateCreditNoteRequest? _selectedData;
+
+    private void ShowCreate()
+    {
+        _currentView = ViewMode.Create;
+    }
+
+    private void ShowUpdate(UpdateCreditNoteRequest data, bool isReadOnly)
+    {
+        _selectedData = data;
+        _currentView = isReadOnly ? ViewMode.View : ViewMode.Update;
+    }
+
+    private void BackToTable()
+    {
+        _currentView = ViewMode.Table;
+        _selectedData = null;
+    }
+
+    private void HandleSuccess()
+    {
+        _currentView = ViewMode.Table;
+        _selectedData = null;
+    }
+}

Features/Sales/CreditNote/Components/_CreditNoteCreateForm.razor

@@ -0,0 +1,177 @@
+@using Indotalent.Features.Sales.CreditNote.Cqrs
+@using Indotalent.Shared.Utils
+@using MudBlazor
+@inject CreditNoteService CreditNoteService
+@inject ISnackbar Snackbar
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #DCEBFA;">
+    <div class="d-flex align-center gap-4">
+        <MudIconButton Icon="@Icons.Material.Filled.ArrowBack" OnClick="() => OnCancel.InvokeAsync()" />
+        <div>
+            <MudText Typo="Typo.h5" Style="font-weight: 900; color: #1a1a1a;">Add Credit Note</MudText>
+            <MudText Typo="Typo.body2" Style="color: #64748b;">Create a new commercial adjustment for sales return.</MudText>
+        </div>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 4px; border: 1px solid #DCEBFA;">
+    <MudForm @ref="_form" Model="_model">
+        <MudGrid Spacing="3">
+            <MudItem xs="12"><MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Basic Information</MudText><MudDivider /></MudItem>
+            
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Credit Note Date</MudText>
+                <MudDatePicker @bind-Date="_model.CreditNoteDate"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Sales Return Reference</MudText>
+                <MudSelect T="string" Value="_model.SalesReturnId"
+                           ValueChanged="OnSalesReturnChanged"
+                           For="@(() => _model.SalesReturnId)"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.SalesReturns)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Status</MudText>
+                <MudSelect T="Indotalent.Data.Enums.CreditNoteStatus" @bind-Value="_model.CreditNoteStatus"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Statuses)
+                    {
+                        <MudSelectItem Value="@((Indotalent.Data.Enums.CreditNoteStatus)item.Value)">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
+                <MudTextField @bind-Value="_model.Description"
+                              For="@(() => _model.Description)"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-6">
+                <_CreditNoteItemDataTable Items="_items" ReadOnly="true" />
+            </MudItem>
+
+            <MudItem xs="12" sm="7"></MudItem>
+            <MudItem xs="12" sm="5">
+                <MudPaper Elevation="0" Outlined="true" Class="pa-4" Style="border-radius: 4px; background-color: #F8FAFC; border: 1px solid #DCEBFA;">
+                    <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;" Class="mb-4 d-block">Adjustment Summary</MudText>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Sub Total</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_beforeTax.ToString("N2")</MudText>
+                    </div>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Tax Amount</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_taxAmount.ToString("N2")</MudText>
+                    </div>
+                    <MudDivider Class="my-2" />
+                    <div class="d-flex justify-space-between">
+                        <MudText Typo="Typo.subtitle1" Style="font-weight: 900;">Total Credit</MudText>
+                        <MudText Typo="Typo.subtitle1" Color="Color.Primary" Style="font-weight: 900;">@_afterTax.ToString("N2")</MudText>
+                    </div>
+                </MudPaper>
+            </MudItem>
+        </MudGrid>
+
+        <div class="d-flex justify-end gap-2 mt-8">
+            <MudButton OnClick="() => OnCancel.InvokeAsync()"
+                       Variant="Variant.Outlined"
+                       Disabled="_processing"
+                       Style="border-radius: 4px; text-transform: none; font-weight: 700;border: 1px solid #e0e0e0;">
+                Cancel
+            </MudButton>
+            <MudButton Color="Color.Primary"
+                       Variant="Variant.Filled"
+                       OnClick="Submit"
+                       Disabled="_processing"
+                       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" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText>Create Credit Note</MudText>
+                }
+            </MudButton>
+        </div>
+    </MudForm>
+</MudPaper>
+
+@code {
+    [Parameter] public EventCallback OnCancel { get; set; }
+    [Parameter] public EventCallback OnSuccess { get; set; }
+
+    private MudForm _form = default!;
+    private CreateCreditNoteRequest _model = new() { CreditNoteDate = DateTime.Today, CreditNoteStatus = Indotalent.Data.Enums.CreditNoteStatus.Draft };
+    private CreditNoteLookupResponse _lookup = new();
+    private List<CreditNoteItemResponse> _items = new();
+    private decimal _beforeTax = 0;
+    private decimal _taxAmount = 0;
+    private decimal _afterTax = 0;
+    private bool _processing = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var res = await CreditNoteService.GetCreditNoteLookupAsync();
+        if (res != null && res.IsSuccess) _lookup = res.Value ?? new();
+    }
+
+    private async Task OnSalesReturnChanged(string srId)
+    {
+        _model.SalesReturnId = srId;
+        if (string.IsNullOrEmpty(srId))
+        {
+            _items.Clear();
+            _beforeTax = 0;
+            _taxAmount = 0;
+            _afterTax = 0;
+            return;
+        }
+
+        var res = await CreditNoteService.GetSalesReturnDetailForCreditNoteAsync(srId);
+        await Task.Delay(500);
+        if (res != null && res.IsSuccess && res.Value != null)
+        {
+            _items = res.Value.Items;
+            _beforeTax = res.Value.BeforeTaxAmount;
+            _taxAmount = res.Value.TaxAmount;
+            _afterTax = res.Value.AfterTaxAmount;
+            Snackbar.Add("Sales Return data and inventory transactions loaded.", Severity.Info);
+        }
+    }
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+
+        _processing = true;
+        try
+        {
+            var response = await CreditNoteService.CreateCreditNoteAsync(_model);
+            await Task.Delay(500);
+
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Created successfully", Severity.Success);
+                await OnSuccess.InvokeAsync();
+            }
+        }
+        finally
+        {
+            _processing = false;
+        }
+    }
+}

Features/Sales/CreditNote/Components/_CreditNoteDataTable.razor

@@ -0,0 +1,380 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.CreditNote
+@using Indotalent.Features.Sales.CreditNote.Cqrs
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using MudBlazor
+@using Features.Root.Shared
+@using ClosedXML.Excel
+@using System.IO
+@inject CreditNoteService CreditNoteService
+@inject IDialogService DialogService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #E5E7EB; border-radius: 12px;">
+    <div>
+        <MudText Typo="Typo.h5" Style="font-weight: 600; color: #111827;">Credit Note</MudText>
+        <MudText Typo="Typo.body2" Style="color: #9CA3AF;">Manage credit notes for sales returns and customer adjustments.</MudText>
+    </div>
+    <div class="d-flex align-center gap-2">
+        <MudIcon Icon="@Icons.Material.Filled.Home" Size="Size.Small" Color="Color.Default" />
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">Sales</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="font-weight: 600; color: #111827;">Credit Note</MudText>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; overflow: hidden; background-color: #ffffff; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff; min-height: 80px;">
+        <div style="display: flex; align-items: center; gap: 8px;">
+            <MudTextField @bind-Value="_searchString"
+                          Placeholder="Search..."
+                          Adornment="Adornment.Start"
+                          AdornmentIcon="@Icons.Material.Filled.Search"
+                          IconSize="Size.Small"
+                          Class="mt-0"
+                          Variant="Variant.Outlined"
+                          Margin="Margin.Dense"
+                          Style="background-color: white; width: 280px; border-radius: 8px;"
+                          OnKeyDown="@HandleSearchKeyDown" />
+            <MudButton Variant="Variant.Filled"
+                       Color="Color.Primary"
+                       OnClick="OnSearchClick"
+                       Size="Size.Small"
+                       Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px; box-shadow: none;">
+                Search
+            </MudButton>
+        </div>
+
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Success"
+                       OnClick="ExportToExcel"
+                       Size="Size.Small"
+                       Disabled="_isExporting"
+                       StartIcon="@(_isExporting ? null : Icons.Custom.FileFormats.FileExcel)"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isExporting)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Excel</MudText>
+                }
+            </MudButton>
+
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Primary"
+                       OnClick="LoadData"
+                       Size="Size.Small"
+                       StartIcon="@(_isRefreshing ? null : Icons.Material.Filled.Refresh)"
+                       Disabled="_isRefreshing"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isRefreshing)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Refreshing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Refresh</MudText>
+                }
+            </MudButton>
+
+            @if (_selectedItem != null)
+            {
+                <MudButton Variant="Variant.Outlined" Color="Color.Info" StartIcon="@Icons.Material.Filled.Visibility" OnClick="InvokeView" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background-color: white; border: 1px solid #D1D5DB; color: #6B7280;">View</MudButton>
+                <MudButton Variant="Variant.Outlined" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Edit" OnClick="InvokeEdit" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background-color: white; border: 1px solid #D1D5DB; color: #6B7280;">Edit</MudButton>
+                <MudButton Variant="Variant.Outlined" Color="Color.Error" StartIcon="@Icons.Material.Filled.Delete" OnClick="OnDelete" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background: white; border: 1px solid #FCA5A5; color: #EF4444;">Remove</MudButton>
+                <MudIconButton Icon="@Icons.Material.Filled.Close" Size="Size.Small" OnClick="() => _selectedItem = null" />
+            }
+            else
+            {
+                <MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add" OnClick="() => OnAdd.InvokeAsync()" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px;">
+                    Add Credit Note
+                </MudButton>
+            }
+        </div>
+    </div>
+
+    <MudTable Items="@GetPagedData()" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" CustomHeader="true" Dense="true" T="GetCreditNoteListResponse" OnRowClick="@((args) => _selectedItem = args.Item)" Loading="@_isRefreshing">
+        <HeaderContent>
+            <MudTh Style="width: 50px; background-color: #ffffff; border-bottom: 1px solid #E5E7EB;"></MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetCreditNoteListResponse, object>(x => x.AutoNumber!)">CN Number</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetCreditNoteListResponse, object>(x => x.CreditNoteDate!)">Date</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetCreditNoteListResponse, object>(x => x.SalesReturnNumber!)">SR Ref</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetCreditNoteListResponse, object>(x => x.CustomerName!)">Customer</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetCreditNoteListResponse, object>(x => x.CreditNoteStatus)">Status</MudTableSortLabel>
+            </MudTh>
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd>
+                <MudCheckBox T="bool" Value="@(_selectedItem?.Id == context.Id)" Color="Color.Primary" Dense="true" Size="Size.Small" ReadOnly="true" />
+            </MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.AutoNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.CreditNoteDate?.ToString("yyyy-MM-dd")</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.SalesReturnNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.CustomerName</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">
+                <MudChip T="string" Color="Color.Info" Size="Size.Small" Variant="Variant.Text" Style="font-weight: 600;">@context.CreditNoteStatus.ToString().ToUpper()</MudChip>
+            </MudTd>
+        </RowTemplate>
+    </MudTable>
+
+    <div style="display: flex; justify-content: space-between; align-items: center; padding: 12px 24px; background-color: #F9FAFB; border-top: 1px solid #E5E7EB;">
+        <div style="display: flex; align-items: center; gap: 12px;">
+            <MudText Typo="Typo.caption" Style="font-weight: 500; color: #9CA3AF; font-size: 0.75rem;">Rows per page:</MudText>
+            <MudSelect T="int" Value="@_top" ValueChanged="OnPageSizeChanged" Dense="true" Margin="Margin.Dense" Style="width: 80px; background-color: white; font-size: 12px; font-weight: 600;" Variant="Variant.Outlined" Class="mt-0">
+                <MudSelectItem Value="5" />
+                <MudSelectItem Value="10" />
+                <MudSelectItem Value="50" />
+                <MudSelectItem Value="500" />
+                <MudSelectItem Value="1000" />
+            </MudSelect>
+            <MudText Typo="Typo.caption" Style="color: #9CA3AF; margin-left: 12px; font-size: 0.75rem; font-weight: 500;">
+                Showing @(GetFilteredData().Count() == 0 ? 0 : _skip + 1)-@Math.Min(_skip + _top, GetFilteredData().Count()) of @GetFilteredData().Count()
+            </MudText>
+        </div>
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudIconButton Icon="@Icons.Material.Filled.FirstPage" Size="Size.Small" OnClick="@(() => OnPageChanged(1))" Disabled="@(_currentPage == 1)" Style="@(_currentPage == 1 ? "color: #D1D5DB; background: transparent;" : "color: #6B7280; background: white; border: 1px solid #D1D5DB; border-radius: 6px;")" />
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage - 1))" Disabled="@(_currentPage == 1)" Variant="Variant.Text" StartIcon="@Icons.Material.Filled.ChevronLeft" Size="Size.Small" Style="@(_currentPage == 1 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Prev</MudButton>
+            @{
+                var totalPages = _totalPage == 0 ? 1 : _totalPage;
+                var maxVisible = 5;
+                var startPage = Math.Max(1, _currentPage - maxVisible / 2);
+                var endPage = Math.Min(totalPages, startPage + maxVisible - 1);
+                if (endPage - startPage < maxVisible - 1) { startPage = Math.Max(1, endPage - maxVisible + 1); }
+            }
+            @for (int i = startPage; i <= endPage; i++)
+            {
+                var pageNum = i;
+                var isActive = pageNum == _currentPage;
+                <MudButton OnClick="@(() => OnPageChanged(pageNum))"
+                           Variant="Variant.Text" Size="Size.Small"
+                           Style="@(isActive ? "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 600; background: #3B82F6; color: white; border: 1px solid #3B82F6; border-radius: 6px; text-transform: none;" : "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 500; color: #374151; background: white; border: 1px solid #D1D5DB; border-radius: 6px; text-transform: none;")">@pageNum</MudButton>
+            }
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage + 1))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Variant="Variant.Text" EndIcon="@Icons.Material.Filled.ChevronRight" Size="Size.Small" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Next</MudButton>
+            <MudIconButton Icon="@Icons.Material.Filled.LastPage" Size="Size.Small" OnClick="@(() => OnPageChanged(_totalPage))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "color: #D1D5DB; background: transparent;" : "background-color: white; border: 1px solid #D1D5DB; color: #6B7280;")" />
+        </div>
+    </div>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    [Parameter] public EventCallback OnAdd { get; set; }
+    [Parameter] public EventCallback<UpdateCreditNoteRequest> OnEdit { get; set; }
+    [Parameter] public EventCallback<UpdateCreditNoteRequest> OnView { get; set; }
+
+    private List<GetCreditNoteListResponse> _items = new();
+    private GetCreditNoteListResponse? _selectedItem;
+    private string _searchString = "";
+    private bool _isRefreshing = false;
+    private bool _isExporting = false;
+
+    private int _skip = 0;
+    private int _top = 5;
+    private int _totalPage => GetFilteredData().Count() == 0 ? 0 : (int)Math.Ceiling((double)GetFilteredData().Count() / (_top == 0 ? 1 : _top));
+    private int _currentPage => (_top >= GetFilteredData().Count() || _top == 0) ? 1 : (_skip / _top) + 1;
+
+    protected override async Task OnInitializedAsync() => await LoadData();
+
+    private async Task LoadData()
+    {
+        _isRefreshing = true;
+        _selectedItem = null;
+        StateHasChanged();
+        try
+        {
+            var response = await CreditNoteService.GetCreditNoteListAsync();
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                _items = response.Value ?? new();
+            }
+        }
+        finally
+        {
+            _isRefreshing = false;
+            StateHasChanged();
+        }
+    }
+
+    private IEnumerable<GetCreditNoteListResponse> GetFilteredData()
+    {
+        if (string.IsNullOrWhiteSpace(_searchString)) return _items;
+        return _items.Where(x =>
+            (x.AutoNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.SalesReturnNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.CustomerName?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false)
+        );
+    }
+
+    private IEnumerable<GetCreditNoteListResponse> GetPagedData() => GetFilteredData().Skip(_skip).Take(_top);
+
+    private void OnSearchClick()
+    {
+        _skip = 0;
+        _selectedItem = null;
+        StateHasChanged();
+    }
+
+    private void HandleSearchKeyDown(KeyboardEventArgs e)
+    {
+        if (e.Key == "Enter") OnSearchClick();
+    }
+
+    private async Task ExportToExcel()
+    {
+        _isExporting = true;
+        StateHasChanged();
+        try
+        {
+            await Task.Delay(1000);
+            using (var workbook = new XLWorkbook())
+            {
+                var worksheet = workbook.Worksheets.Add("CreditNotes");
+                var currentRow = 1;
+
+                worksheet.Cell(currentRow, 1).Value = "CN Number";
+                worksheet.Cell(currentRow, 2).Value = "Date";
+                worksheet.Cell(currentRow, 3).Value = "SR Ref";
+                worksheet.Cell(currentRow, 4).Value = "Customer";
+                worksheet.Cell(currentRow, 5).Value = "Status";
+
+                var headerRange = worksheet.Range(1, 1, 1, 5);
+                headerRange.Style.Font.Bold = true;
+                headerRange.Style.Fill.BackgroundColor = XLColor.FromHtml("#0D47A1");
+                headerRange.Style.Font.FontColor = XLColor.White;
+
+                foreach (var item in GetFilteredData())
+                {
+                    currentRow++;
+                    worksheet.Cell(currentRow, 1).Value = item.AutoNumber;
+                    worksheet.Cell(currentRow, 2).Value = item.CreditNoteDate?.ToString("yyyy-MM-dd");
+                    worksheet.Cell(currentRow, 3).Value = item.SalesReturnNumber;
+                    worksheet.Cell(currentRow, 4).Value = item.CustomerName;
+                    worksheet.Cell(currentRow, 5).Value = item.CreditNoteStatus.ToString();
+                }
+
+                worksheet.Columns().AdjustToContents();
+
+                using (var stream = new MemoryStream())
+                {
+                    workbook.SaveAs(stream);
+                    var content = Convert.ToBase64String(stream.ToArray());
+                    await JSRuntime.InvokeVoidAsync("downloadFile", "CreditNote_List.xlsx", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", content);
+                    Snackbar.Add("Excel exported successfully", Severity.Success);
+                }
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Export failed: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _isExporting = false;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageChanged(int page)
+    {
+        if (page >= 1 && page <= _totalPage)
+        {
+            _skip = (page - 1) * _top;
+            _selectedItem = null;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageSizeChanged(int size)
+    {
+        _top = size;
+        _skip = 0;
+        _selectedItem = null;
+        StateHasChanged();
+    }
+
+    private async Task InvokeEdit()
+    {
+        if (_selectedItem == null) return;
+        var request = await MapToUpdateRequest(_selectedItem.Id!);
+        if (request != null) await OnEdit.InvokeAsync(request);
+    }
+
+    private async Task InvokeView()
+    {
+        if (_selectedItem == null) return;
+        var request = await MapToUpdateRequest(_selectedItem.Id!);
+        if (request != null) await OnView.InvokeAsync(request);
+    }
+
+    private async Task<UpdateCreditNoteRequest?> MapToUpdateRequest(string id)
+    {
+        var response = await CreditNoteService.GetCreditNoteByIdAsync(id);
+        if (response != null && response.IsSuccess && response.Value != null)
+        {
+            var detail = response.Value;
+            return new UpdateCreditNoteRequest
+            {
+                Id = detail.Id,
+                CreditNoteDate = detail.CreditNoteDate,
+                CreditNoteStatus = detail.CreditNoteStatus,
+                AutoNumber = detail.AutoNumber,
+                Description = detail.Description,
+                SalesReturnId = detail.SalesReturnId,
+                BeforeTaxAmount = detail.BeforeTaxAmount,
+                TaxAmount = detail.TaxAmount,
+                AfterTaxAmount = detail.AfterTaxAmount,
+                CreatedAt = detail.CreatedAt,
+                CreatedBy = detail.CreatedBy,
+                UpdatedAt = detail.UpdatedAt,
+                UpdatedBy = detail.UpdatedBy
+            };
+        }
+        return null;
+    }
+
+    private async Task OnDelete()
+    {
+        if (_selectedItem == null) return;
+
+        var parameters = new DialogParameters<_DeleteConfirmation> { { x => x.ContentText, _selectedItem.AutoNumber } };
+        var options = new DialogOptions { CloseButton = false, MaxWidth = MaxWidth.ExtraSmall, FullWidth = true };
+
+        var dialog = await DialogService.ShowAsync<_DeleteConfirmation>("", parameters, options);
+        var result = await dialog.Result;
+
+        if (result != null && !result.Canceled)
+        {
+            var isSuccess = await CreditNoteService.DeleteCreditNoteByIdAsync(_selectedItem.Id!);
+            if (isSuccess)
+            {
+                _selectedItem = null;
+                await LoadData();
+                Snackbar.Add("Deleted successfully", Severity.Success);
+            }
+        }
+    }
+}

Features/Sales/CreditNote/Components/_CreditNoteItemDataTable.razor

@@ -0,0 +1,36 @@
+@using Indotalent.Features.Sales.CreditNote.Cqrs
+@using MudBlazor
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; background-color: #ffffff;">
+        <MudText Typo="Typo.button" Color="Color.Default" Style="font-weight: 600; color: #111827;">Returned Inventory Items</MudText>
+    </div>
+
+    <MudTable Items="Items" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" Dense="true" T="CreditNoteItemResponse">
+        <HeaderContent>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">Product</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Unit Price</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Qty Returned</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Total Adjustment</MudTh>
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd DataLabel="Product">@context.ProductName</MudTd>
+            <MudTd DataLabel="UnitPrice" Style="text-align: right;">@context.UnitPrice.ToString("N2")</MudTd>
+            <MudTd DataLabel="Quantity" Style="text-align: right;">@context.Quantity</MudTd>
+            <MudTd DataLabel="Total" Style="text-align: right; font-weight: 700;">@context.Total.ToString("N2")</MudTd>
+        </RowTemplate>
+    </MudTable>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    [Parameter] public List<CreditNoteItemResponse> Items { get; set; } = new();
+    [Parameter] public bool ReadOnly { get; set; } = true;
+}

Features/Sales/CreditNote/Components/_CreditNoteUpdateForm.razor

@@ -0,0 +1,262 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.CreditNote.Cqrs
+@using Indotalent.Features.Sales.CreditNote.Components
+@using Indotalent.Shared.Utils
+@using MudBlazor
+@using Microsoft.JSInterop
+@inject CreditNoteService CreditNoteService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #DCEBFA;">
+    <div class="d-flex align-center gap-4">
+        <MudIconButton Icon="@Icons.Material.Filled.ArrowBack" OnClick="() => OnCancel.InvokeAsync()" />
+        <div>
+            <MudText Typo="Typo.h5" Style="font-weight: 900; color: #1a1a1a;">@(ReadOnly ? "Details" : "Edit") Credit Note</MudText>
+            <MudText Typo="Typo.body2" Style="color: #64748b;">@_model.AutoNumber</MudText>
+        </div>
+    </div>
+    @if (ReadOnly || !string.IsNullOrEmpty(_model.Id))
+    {
+        <MudButton Variant="Variant.Filled"
+                   Color="Color.Info"
+                   StartIcon="@(_isPrinting ? null : Icons.Material.Filled.Print)"
+                   OnClick="DownloadPdf"
+                   Disabled="_isPrinting"
+                   Style="border-radius: 4px; text-transform: none; font-weight: 700; box-shadow: none;">
+            @if (_isPrinting)
+            {
+                <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                <MudText Class="ms-2">Generating PDF...</MudText>
+            }
+            else
+            {
+                <MudText>Print PDF</MudText>
+            }
+        </MudButton>
+    }
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 4px; border: 1px solid #DCEBFA;">
+    <MudForm @ref="_form" Model="_model">
+        <MudGrid Spacing="3">
+            <MudItem xs="12"><MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Basic Information</MudText><MudDivider /></MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Credit Note Date</MudText>
+                <MudDatePicker @bind-Date="_model.CreditNoteDate" ReadOnly="ReadOnly"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Sales Return Reference</MudText>
+                <MudSelect T="string" Value="_model.SalesReturnId"
+                           ValueChanged="OnSalesReturnChanged"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.SalesReturns)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Status</MudText>
+                <MudSelect T="Indotalent.Data.Enums.CreditNoteStatus" @bind-Value="_model.CreditNoteStatus"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Statuses)
+                    {
+                        <MudSelectItem Value="@((Indotalent.Data.Enums.CreditNoteStatus)item.Value)">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
+                <MudTextField @bind-Value="_model.Description"
+                              ReadOnly="ReadOnly"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-6">
+                <_CreditNoteItemDataTable Items="_items" ReadOnly="true" />
+            </MudItem>
+
+            <MudItem xs="12" sm="7"></MudItem>
+            <MudItem xs="12" sm="5">
+                <MudPaper Elevation="0" Outlined="true" Class="pa-4" Style="border-radius: 4px; background-color: #F8FAFC; border: 1px solid #DCEBFA;">
+                    <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;" Class="mb-4 d-block">Adjustment Summary</MudText>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Sub Total</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_model.BeforeTaxAmount?.ToString("N2")</MudText>
+                    </div>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Tax Amount</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_model.TaxAmount?.ToString("N2")</MudText>
+                    </div>
+                    <MudDivider Class="my-2" />
+                    <div class="d-flex justify-space-between">
+                        <MudText Typo="Typo.subtitle1" Style="font-weight: 900;">Total Credit</MudText>
+                        <MudText Typo="Typo.subtitle1" Color="Color.Primary" Style="font-weight: 900;">@_model.AfterTaxAmount?.ToString("N2")</MudText>
+                    </div>
+                </MudPaper>
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-4">
+                <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Audit History</MudText>
+                <MudDivider Class="mt-2 mb-4" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Created At</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@DateTimeExtensions.ToString(_model.CreatedAt)</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Created By</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@(!string.IsNullOrEmpty(_model.CreatedBy) ? _model.CreatedBy : "System")</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Last Updated At</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@DateTimeExtensions.ToString(_model.UpdatedAt)</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Last Updated By</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@(!string.IsNullOrEmpty(_model.UpdatedBy) ? _model.UpdatedBy : "System")</MudText>
+            </MudItem>
+        </MudGrid>
+
+        <div class="d-flex justify-end gap-2 mt-10">
+            <MudButton OnClick="() => OnCancel.InvokeAsync()"
+                       Variant="Variant.Outlined"
+                       Disabled="_processing"
+                       Style="border-radius: 4px; text-transform: none; font-weight: 700;border: 1px solid #e0e0e0;">
+                @(ReadOnly ? "Back to List" : "Cancel")
+            </MudButton>
+            @if (!ReadOnly)
+            {
+                <MudButton Color="Color.Primary"
+                           Variant="Variant.Filled"
+                           OnClick="Submit"
+                           Disabled="_processing"
+                           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>Save Changes</MudText>
+                    }
+                </MudButton>
+            }
+        </div>
+    </MudForm>
+</MudPaper>
+
+@code {
+    [Parameter] public UpdateCreditNoteRequest Data { get; set; } = new();
+    [Parameter] public bool ReadOnly { get; set; } = false;
+    [Parameter] public EventCallback OnCancel { get; set; }
+    [Parameter] public EventCallback OnSuccess { get; set; }
+
+    private MudForm _form = default!;
+    private UpdateCreditNoteRequest _model = new();
+    private List<CreditNoteItemResponse> _items = new();
+    private CreditNoteLookupResponse _lookup = new();
+    private bool _processing = false;
+    private bool _isPrinting = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var resLookup = await CreditNoteService.GetCreditNoteLookupAsync();
+        if (resLookup != null && resLookup.IsSuccess) _lookup = resLookup.Value ?? new();
+
+        _model = Data;
+        await RefreshItems();
+    }
+
+    private async Task OnSalesReturnChanged(string srId)
+    {
+        if (ReadOnly || _model.SalesReturnId == srId) return;
+        _model.SalesReturnId = srId;
+        await RefreshItems();
+        Snackbar.Add("Sales Return reference changed. Items and totals recalculated.", Severity.Info);
+    }
+
+    private async Task RefreshItems()
+    {
+        if (string.IsNullOrEmpty(_model.SalesReturnId)) return;
+
+        try
+        {
+            var response = await CreditNoteService.GetSalesReturnDetailForCreditNoteAsync(_model.SalesReturnId);
+            await Task.Delay(500);
+            
+            if (response != null && response.IsSuccess && response.Value != null)
+            {
+                _items = response.Value.Items;
+                _model.BeforeTaxAmount = response.Value.BeforeTaxAmount;
+                _model.TaxAmount = response.Value.TaxAmount;
+                _model.AfterTaxAmount = response.Value.AfterTaxAmount;
+                StateHasChanged();
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+    }
+
+    private async Task DownloadPdf()
+    {
+        try
+        {
+            _isPrinting = true;
+            StateHasChanged();
+            await Task.Delay(1000);
+
+            var response = await CreditNoteService.GetCreditNoteByIdAsync(_model.Id!);
+            if (response != null && response.IsSuccess && response.Value != null)
+            {
+                var pdfBytes = CreditNotePdfGenerator.Generate(response.Value);
+                var fileName = $"CN_{response.Value.AutoNumber}.pdf";
+                var base64 = Convert.ToBase64String(pdfBytes);
+                await JSRuntime.InvokeVoidAsync("downloadFile", fileName, "application/pdf", base64);
+                Snackbar.Add("PDF generated successfully.", Severity.Success);
+            }
+        }
+        finally
+        {
+            _isPrinting = false;
+            StateHasChanged();
+        }
+    }
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+
+        _processing = true;
+        try
+        {
+            var response = await CreditNoteService.UpdateCreditNoteAsync(_model);
+            await Task.Delay(500);
+
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Updated successfully", Severity.Success);
+                await OnSuccess.InvokeAsync();
+            }
+        }
+        finally
+        {
+            _processing = false;
+        }
+    }
+}

Features/Sales/CreditNote/Cqrs/CreateCreditNoteHandler.cs

@@ -0,0 +1,55 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Infrastructure.Database;
+using MediatR;
+
+namespace Indotalent.Features.Sales.CreditNote.Cqrs;
+
+public class CreateCreditNoteRequest
+{
+    public DateTime? CreditNoteDate { get; set; }
+    public Data.Enums.CreditNoteStatus CreditNoteStatus { get; set; }
+    public string? Description { get; set; }
+    public string? SalesReturnId { get; set; }
+}
+
+public class CreateCreditNoteResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+}
+
+public record CreateCreditNoteCommand(CreateCreditNoteRequest Data) : IRequest<CreateCreditNoteResponse>;
+
+public class CreateCreditNoteHandler : IRequestHandler<CreateCreditNoteCommand, CreateCreditNoteResponse>
+{
+    private readonly AppDbContext _context;
+    public CreateCreditNoteHandler(AppDbContext context) => _context = context;
+
+    public async Task<CreateCreditNoteResponse> Handle(CreateCreditNoteCommand request, CancellationToken cancellationToken)
+    {
+        var entityName = nameof(Data.Entities.CreditNote);
+        var autoNo = await _context.GenerateAutoNumberAsync(
+            entityName: entityName,
+            prefixTemplate: $"CN/{{Year}}/{{Month}}/",
+            ct: cancellationToken
+        );
+
+        var entity = new Data.Entities.CreditNote
+        {
+            AutoNumber = autoNo,
+            CreditNoteDate = request.Data.CreditNoteDate,
+            CreditNoteStatus = request.Data.CreditNoteStatus,
+            Description = request.Data.Description,
+            SalesReturnId = request.Data.SalesReturnId
+        };
+
+        _context.CreditNote.Add(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+
+        return new CreateCreditNoteResponse
+        {
+            Id = entity.Id,
+            AutoNumber = entity.AutoNumber
+        };
+    }
+}

Features/Sales/CreditNote/Cqrs/CreateCreditNoteValidator.cs

@@ -0,0 +1,12 @@
+using FluentValidation;
+
+namespace Indotalent.Features.Sales.CreditNote.Cqrs;
+
+public class CreateCreditNoteValidator : AbstractValidator<CreateCreditNoteRequest>
+{
+    public CreateCreditNoteValidator()
+    {
+        RuleFor(x => x.CreditNoteDate).NotEmpty().WithMessage("Date is required");
+        RuleFor(x => x.SalesReturnId).NotEmpty().WithMessage("Sales Return reference is required");
+    }
+}

Features/Sales/CreditNote/Cqrs/DeleteCreditNoteByIdHandler.cs

@@ -0,0 +1,25 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.CreditNote.Cqrs;
+
+public record DeleteCreditNoteByIdCommand(string Id) : IRequest<bool>;
+
+public class DeleteCreditNoteByIdHandler : IRequestHandler<DeleteCreditNoteByIdCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public DeleteCreditNoteByIdHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(DeleteCreditNoteByIdCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.CreditNote
+            .FirstOrDefaultAsync(x => x.Id == request.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        _context.CreditNote.Remove(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+        return true;
+    }
+}

Features/Sales/CreditNote/Cqrs/GetCreditNoteByIdHandler.cs

@@ -0,0 +1,135 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.CreditNote.Cqrs;
+
+public class CreditNoteItemResponse
+{
+    public string? Id { get; set; }
+    public string? ProductId { get; set; }
+    public string? ProductName { get; set; }
+    public decimal UnitPrice { get; set; }
+    public double Quantity { get; set; }
+    public decimal Total { get; set; }
+}
+
+public class GetCreditNoteByIdResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+    public DateTime? CreditNoteDate { get; set; }
+    public Data.Enums.CreditNoteStatus CreditNoteStatus { get; set; }
+    public string? Description { get; set; }
+    public string? SalesReturnId { get; set; }
+    public string? SalesReturnNumber { get; set; }
+    public string? CustomerName { get; set; }
+    public string? CustomerStreet { get; set; }
+    public string? CustomerCity { get; set; }
+    public string? CompanyName { get; set; }
+    public string? CompanyStreet { get; set; }
+    public string? CompanyCity { get; set; }
+    public string? CurrencySymbol { get; set; }
+    public decimal BeforeTaxAmount { get; set; }
+    public decimal TaxAmount { get; set; }
+    public decimal AfterTaxAmount { get; set; }
+    public DateTimeOffset? CreatedAt { get; set; }
+    public string? CreatedBy { get; set; }
+    public DateTimeOffset? UpdatedAt { get; set; }
+    public string? UpdatedBy { get; set; }
+    public List<CreditNoteItemResponse> Items { get; set; } = new();
+}
+
+public record GetCreditNoteByIdQuery(string Id) : IRequest<GetCreditNoteByIdResponse?>;
+
+public class GetCreditNoteByIdHandler : IRequestHandler<GetCreditNoteByIdQuery, GetCreditNoteByIdResponse?>
+{
+    private readonly AppDbContext _context;
+    public GetCreditNoteByIdHandler(AppDbContext context) => _context = context;
+
+    public async Task<GetCreditNoteByIdResponse?> Handle(GetCreditNoteByIdQuery request, CancellationToken cancellationToken)
+    {
+        var company = await _context.Company
+            .AsNoTracking()
+            .Include(x => x.Currency)
+            .OrderByDescending(x => x.IsDefault)
+            .FirstOrDefaultAsync(cancellationToken);
+
+        var creditNote = await _context.CreditNote
+            .AsNoTracking()
+            .Include(x => x.SalesReturn)
+                .ThenInclude(sr => sr!.DeliveryOrder)
+                    .ThenInclude(do_ => do_!.SalesOrder)
+                        .ThenInclude(so => so!.Customer)
+            .Include(x => x.SalesReturn)
+                .ThenInclude(sr => sr!.DeliveryOrder)
+                    .ThenInclude(do_ => do_!.SalesOrder)
+                        .ThenInclude(so => so!.Tax)
+            .FirstOrDefaultAsync(x => x.Id == request.Id, cancellationToken);
+
+        if (creditNote == null) return null;
+
+        var salesOrder = creditNote.SalesReturn?.DeliveryOrder?.SalesOrder;
+        var taxRate = salesOrder?.Tax?.PercentageValue ?? 0;
+
+        var transactions = await _context.InventoryTransaction
+            .AsNoTracking()
+            .Include(x => x.Product)
+            .Where(x => x.ModuleId == creditNote.SalesReturnId && x.ModuleName == nameof(Data.Entities.SalesReturn))
+            .ToListAsync(cancellationToken);
+
+        var items = new List<CreditNoteItemResponse>();
+        decimal subTotal = 0;
+
+        foreach (var trans in transactions)
+        {
+            var soItem = await _context.SalesOrderItem
+                .AsNoTracking()
+                .FirstOrDefaultAsync(x => x.SalesOrderId == salesOrder!.Id && x.ProductId == trans.ProductId, cancellationToken);
+
+            var unitPrice = soItem?.UnitPrice ?? 0;
+            var qty = Math.Abs(trans.Movement ?? 0);
+            var total = unitPrice * (decimal)qty;
+
+            items.Add(new CreditNoteItemResponse
+            {
+                Id = trans.Id,
+                ProductId = trans.ProductId,
+                ProductName = trans.Product?.Name,
+                UnitPrice = unitPrice,
+                Quantity = qty,
+                Total = total
+            });
+
+            subTotal += total;
+        }
+
+        var taxAmount = subTotal * (decimal)(taxRate / 100);
+
+        return new GetCreditNoteByIdResponse
+        {
+            Id = creditNote.Id,
+            AutoNumber = creditNote.AutoNumber,
+            CreditNoteDate = creditNote.CreditNoteDate,
+            CreditNoteStatus = creditNote.CreditNoteStatus,
+            Description = creditNote.Description,
+            SalesReturnId = creditNote.SalesReturnId,
+            SalesReturnNumber = creditNote.SalesReturn?.AutoNumber,
+            CustomerName = salesOrder?.Customer?.Name,
+            CustomerStreet = salesOrder?.Customer?.Street,
+            CustomerCity = salesOrder?.Customer?.City,
+            CompanyName = company?.Name,
+            CompanyStreet = company?.StreetAddress,
+            CompanyCity = company?.City,
+            CurrencySymbol = company?.Currency?.Symbol ?? "IDR",
+            BeforeTaxAmount = subTotal,
+            TaxAmount = taxAmount,
+            AfterTaxAmount = subTotal + taxAmount,
+            CreatedAt = creditNote.CreatedAt,
+            CreatedBy = creditNote.CreatedBy,
+            UpdatedAt = creditNote.UpdatedAt,
+            UpdatedBy = creditNote.UpdatedBy,
+            Items = items
+        };
+    }
+}

Features/Sales/CreditNote/Cqrs/GetCreditNoteListHandler.cs

@@ -0,0 +1,43 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.CreditNote.Cqrs;
+
+public class GetCreditNoteListResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+    public DateTime? CreditNoteDate { get; set; }
+    public string? SalesReturnNumber { get; set; }
+    public string? CustomerName { get; set; }
+    public Data.Enums.CreditNoteStatus CreditNoteStatus { get; set; }
+}
+
+public record GetCreditNoteListQuery() : IRequest<List<GetCreditNoteListResponse>>;
+
+public class GetCreditNoteListHandler : IRequestHandler<GetCreditNoteListQuery, List<GetCreditNoteListResponse>>
+{
+    private readonly AppDbContext _context;
+    public GetCreditNoteListHandler(AppDbContext context) => _context = context;
+
+    public async Task<List<GetCreditNoteListResponse>> Handle(GetCreditNoteListQuery request, CancellationToken cancellationToken)
+    {
+        return await _context.CreditNote
+            .AsNoTracking()
+            .Include(x => x.SalesReturn)
+                .ThenInclude(sr => sr!.DeliveryOrder)
+                    .ThenInclude(do_ => do_!.SalesOrder)
+                        .ThenInclude(so => so!.Customer)
+            .OrderByDescending(x => x.CreatedAt)
+            .Select(x => new GetCreditNoteListResponse
+            {
+                Id = x.Id,
+                AutoNumber = x.AutoNumber,
+                CreditNoteDate = x.CreditNoteDate,
+                SalesReturnNumber = x.SalesReturn!.AutoNumber,
+                CustomerName = x.SalesReturn!.DeliveryOrder!.SalesOrder!.Customer!.Name,
+                CreditNoteStatus = x.CreditNoteStatus
+            }).ToListAsync(cancellationToken);
+    }
+}

Features/Sales/CreditNote/Cqrs/GetCreditNoteLookupHandler.cs

@@ -0,0 +1,54 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+using Indotalent.Data.Enums;
+using Indotalent.ConfigBackEnd.Extensions;
+
+namespace Indotalent.Features.Sales.CreditNote.Cqrs;
+
+public class CreditNoteLookupResponse
+{
+    public List<LookupItem> SalesReturns { get; set; } = new();
+    public List<LookupStatusItem> Statuses { get; set; } = new();
+}
+
+public class LookupItem
+{
+    public string? Id { get; set; }
+    public string? Name { get; set; }
+}
+
+public class LookupStatusItem
+{
+    public int Value { get; set; }
+    public string? Name { get; set; }
+}
+
+public record GetCreditNoteLookupQuery() : IRequest<CreditNoteLookupResponse>;
+
+public class GetCreditNoteLookupHandler : IRequestHandler<GetCreditNoteLookupQuery, CreditNoteLookupResponse>
+{
+    private readonly AppDbContext _context;
+    public GetCreditNoteLookupHandler(AppDbContext context) => _context = context;
+
+    public async Task<CreditNoteLookupResponse> Handle(GetCreditNoteLookupQuery request, CancellationToken cancellationToken)
+    {
+        var response = new CreditNoteLookupResponse();
+
+        response.SalesReturns = await _context.SalesReturn.AsNoTracking()
+            .Where(x => x.Status == SalesReturnStatus.Confirmed)
+            .OrderByDescending(x => x.CreatedAt)
+            .Select(x => new LookupItem { Id = x.Id, Name = x.AutoNumber })
+            .ToListAsync(cancellationToken);
+
+        response.Statuses = Enum.GetValues(typeof(CreditNoteStatus))
+            .Cast<CreditNoteStatus>()
+            .Select(x => new LookupStatusItem
+            {
+                Value = (int)x,
+                Name = x.GetDescription()
+            }).ToList();
+
+        return response;
+    }
+}

Features/Sales/CreditNote/Cqrs/GetSalesReturnDetailForCreditNoteHandler.cs

@@ -0,0 +1,72 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.CreditNote.Cqrs;
+
+public record GetSalesReturnDetailForCreditNoteQuery(string SalesReturnId) : IRequest<GetCreditNoteByIdResponse?>;
+
+public class GetSalesReturnDetailForCreditNoteHandler : IRequestHandler<GetSalesReturnDetailForCreditNoteQuery, GetCreditNoteByIdResponse?>
+{
+    private readonly AppDbContext _context;
+    public GetSalesReturnDetailForCreditNoteHandler(AppDbContext context) => _context = context;
+
+    public async Task<GetCreditNoteByIdResponse?> Handle(GetSalesReturnDetailForCreditNoteQuery request, CancellationToken cancellationToken)
+    {
+        var salesReturn = await _context.SalesReturn
+            .AsNoTracking()
+            .Include(x => x.DeliveryOrder)
+                .ThenInclude(do_ => do_!.SalesOrder)
+                    .ThenInclude(so => so!.Tax)
+            .FirstOrDefaultAsync(x => x.Id == request.SalesReturnId, cancellationToken);
+
+        if (salesReturn == null) return null;
+
+        var salesOrder = salesReturn.DeliveryOrder?.SalesOrder;
+        var taxRate = salesOrder?.Tax?.PercentageValue ?? 0;
+
+        var transactions = await _context.InventoryTransaction
+            .AsNoTracking()
+            .Include(x => x.Product)
+            .Where(x => x.ModuleId == request.SalesReturnId && x.ModuleName == nameof(Data.Entities.SalesReturn))
+            .ToListAsync(cancellationToken);
+
+        var items = new List<CreditNoteItemResponse>();
+        decimal subTotal = 0;
+
+        foreach (var trans in transactions)
+        {
+            var soItem = await _context.SalesOrderItem
+                .AsNoTracking()
+                .FirstOrDefaultAsync(x => x.SalesOrderId == salesOrder!.Id && x.ProductId == trans.ProductId, cancellationToken);
+
+            var unitPrice = soItem?.UnitPrice ?? 0;
+            var qty = Math.Abs(trans.Movement ?? 0);
+            var total = unitPrice * (decimal)qty;
+
+            items.Add(new CreditNoteItemResponse
+            {
+                Id = trans.Id,
+                ProductId = trans.ProductId,
+                ProductName = trans.Product?.Name,
+                UnitPrice = unitPrice,
+                Quantity = qty,
+                Total = total
+            });
+
+            subTotal += total;
+        }
+
+        var taxAmount = subTotal * (decimal)(taxRate / 100);
+
+        return new GetCreditNoteByIdResponse
+        {
+            SalesReturnId = salesReturn.Id,
+            SalesReturnNumber = salesReturn.AutoNumber,
+            BeforeTaxAmount = subTotal,
+            TaxAmount = taxAmount,
+            AfterTaxAmount = subTotal + taxAmount,
+            Items = items
+        };
+    }
+}

Features/Sales/CreditNote/Cqrs/UpdateCreditNoteHandler.cs

@@ -0,0 +1,46 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.CreditNote.Cqrs;
+
+public class UpdateCreditNoteRequest
+{
+    public string? Id { get; set; }
+    public DateTime? CreditNoteDate { get; set; }
+    public Data.Enums.CreditNoteStatus CreditNoteStatus { get; set; }
+    public string? AutoNumber { get; set; }
+    public string? Description { get; set; }
+    public string? SalesReturnId { get; set; }
+    public decimal? BeforeTaxAmount { get; set; }
+    public decimal? TaxAmount { get; set; }
+    public decimal? AfterTaxAmount { get; set; }
+    public DateTimeOffset? CreatedAt { get; set; }
+    public string? CreatedBy { get; set; }
+    public DateTimeOffset? UpdatedAt { get; set; }
+    public string? UpdatedBy { get; set; }
+}
+
+public record UpdateCreditNoteCommand(UpdateCreditNoteRequest Data) : IRequest<bool>;
+
+public class UpdateCreditNoteHandler : IRequestHandler<UpdateCreditNoteCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public UpdateCreditNoteHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(UpdateCreditNoteCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.CreditNote
+            .FirstOrDefaultAsync(x => x.Id == request.Data.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        entity.CreditNoteDate = request.Data.CreditNoteDate;
+        entity.CreditNoteStatus = request.Data.CreditNoteStatus;
+        entity.Description = request.Data.Description;
+        entity.SalesReturnId = request.Data.SalesReturnId;
+
+        await _context.SaveChangesAsync(cancellationToken);
+        return true;
+    }
+}

Features/Sales/CreditNote/Cqrs/UpdateCreditNoteValidator.cs

@@ -0,0 +1,12 @@
+using FluentValidation;
+
+namespace Indotalent.Features.Sales.CreditNote.Cqrs;
+
+public class UpdateCreditNoteValidator : AbstractValidator<UpdateCreditNoteRequest>
+{
+    public UpdateCreditNoteValidator()
+    {
+        RuleFor(x => x.Id).NotEmpty();
+        RuleFor(x => x.SalesReturnId).NotEmpty().WithMessage("Sales Return reference is required");
+    }
+}

Features/Sales/CreditNote/CreditNoteEndpoint.cs

@@ -0,0 +1,77 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Features.Sales.CreditNote.Cqrs;
+using MediatR;
+using Microsoft.AspNetCore.Authentication.JwtBearer;
+
+namespace Indotalent.Features.Sales.CreditNote;
+
+public static class CreditNoteEndpoint
+{
+    public static void MapCreditNoteEndpoints(this IEndpointRouteBuilder app)
+    {
+        var group = app.MapGroup("/credit-note").WithTags("CreditNotes")
+            .RequireAuthorization(policy => policy.AddAuthenticationSchemes(JwtBearerDefaults.AuthenticationScheme)
+            .RequireAuthenticatedUser());
+
+        group.MapGet("/", async (IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetCreditNoteListQuery());
+            return result.ToApiResponse("Credit note list retrieved successfully");
+        })
+        .WithName("GetCreditNoteList");
+
+        group.MapGet("/{id}", async (string id, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetCreditNoteByIdQuery(id));
+            return result.ToApiResponse(result is not null
+                ? "Credit note detail retrieved successfully"
+                : $"Credit note with ID {id} not found");
+        })
+        .WithName("GetCreditNoteById");
+
+        group.MapGet("/sales-return-detail/{srId}", async (string srId, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetSalesReturnDetailForCreditNoteQuery(srId));
+            return result.ToApiResponse(result is not null
+                ? "Sales return detail for credit note retrieved successfully"
+                : $"Sales return with ID {srId} not found");
+        })
+        .WithName("GetSalesReturnDetailForCreditNote");
+
+        group.MapGet("/lookup", async (IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetCreditNoteLookupQuery());
+            return result.ToApiResponse("Lookup data retrieved successfully");
+        })
+        .WithName("GetCreditNoteLookup");
+
+        group.MapPost("/", async (CreateCreditNoteRequest request, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new CreateCreditNoteCommand(request));
+            return result.ToApiResponse("Credit note has been created successfully", StatusCodes.Status201Created);
+        })
+        .WithName("CreateCreditNote");
+
+        group.MapPost("/update", async (UpdateCreditNoteRequest request, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new UpdateCreditNoteCommand(request));
+            if (!result)
+            {
+                return ((object?)null).ToApiResponse("Update failed. Credit note not found.");
+            }
+            return result.ToApiResponse("Credit note has been updated successfully");
+        })
+        .WithName("UpdateCreditNote");
+
+        group.MapPost("/delete/{id}", async (string id, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new DeleteCreditNoteByIdCommand(id));
+            if (!result)
+            {
+                return ((object?)null).ToApiResponse("Delete failed. Credit note not found.");
+            }
+            return true.ToApiResponse("Credit note has been deleted successfully");
+        })
+        .WithName("DeleteCreditNoteById");
+    }
+}

Features/Sales/CreditNote/CreditNotePdfGenerator.cs

@@ -0,0 +1,126 @@
+using QuestPDF.Fluent;
+using QuestPDF.Helpers;
+using QuestPDF.Infrastructure;
+using Indotalent.Features.Sales.CreditNote.Cqrs;
+
+namespace Indotalent.Features.Sales.CreditNote;
+
+public class CreditNotePdfGenerator
+{
+    public static byte[] Generate(GetCreditNoteByIdResponse data)
+    {
+        QuestPDF.Settings.License = LicenseType.Community;
+
+        var primaryBlue = "#0D47A1";
+        var textSlate = "#64748b";
+
+        return Document.Create(container =>
+        {
+            container.Page(page =>
+            {
+                page.Size(PageSizes.A4);
+                page.Margin(1.5f, Unit.Centimetre);
+                page.PageColor(Colors.White);
+                page.DefaultTextStyle(x => x.FontSize(9).FontFamily(Fonts.Verdana));
+
+                page.Header().Row(row =>
+                {
+                    row.RelativeItem().Column(col =>
+                    {
+                        col.Item().Text("CREDIT NOTE")
+                            .FontSize(20).ExtraBold().FontColor(primaryBlue);
+                        col.Item().Text($"{data.AutoNumber}").FontSize(11).SemiBold();
+                        col.Item().Text($"Sales Return Ref: {data.SalesReturnNumber}").FontSize(9).FontColor(textSlate);
+                    });
+
+                    row.RelativeItem().AlignRight().Column(col =>
+                    {
+                        col.Item().Text(data.CompanyName).FontSize(11).ExtraBold();
+                        col.Item().Text($"{data.CompanyStreet}").FontColor(textSlate);
+                        col.Item().Text($"{data.CompanyCity}").FontColor(textSlate);
+                    });
+                });
+
+                page.Content().PaddingVertical(20).Column(col =>
+                {
+                    col.Item().Row(row =>
+                    {
+                        row.RelativeItem().Column(c =>
+                        {
+                            c.Item().BorderBottom(1).PaddingBottom(5).Text("BILL TO (CUSTOMER)").FontSize(8).Bold().FontColor(textSlate);
+                            c.Item().PaddingTop(5).Text(data.CustomerName).Bold();
+                            c.Item().Text(data.CustomerStreet);
+                            c.Item().Text(data.CustomerCity);
+                        });
+
+                        row.ConstantItem(40);
+
+                        row.RelativeItem().Column(c =>
+                        {
+                            c.Item().BorderBottom(1).PaddingBottom(5).Text("DOCUMENT DETAILS").FontSize(8).Bold().FontColor(textSlate);
+                            c.Item().PaddingTop(5).Row(r => {
+                                r.RelativeItem().Text("Credit Note Date");
+                                r.RelativeItem().AlignRight().Text(data.CreditNoteDate?.ToString("dd MMM yyyy"));
+                            });
+                            c.Item().Row(r => {
+                                r.RelativeItem().Text("Status");
+                                r.RelativeItem().AlignRight().Text(data.CreditNoteStatus.ToString().ToUpper()).Bold().FontColor(primaryBlue);
+                            });
+                        });
+                    });
+
+                    col.Item().PaddingTop(20).Table(table =>
+                    {
+                        table.ColumnsDefinition(columns =>
+                        {
+                            columns.ConstantColumn(25);
+                            columns.RelativeColumn(4);
+                            columns.RelativeColumn(2);
+                            columns.RelativeColumn(1.5f);
+                            columns.RelativeColumn(2.5f);
+                        });
+
+                        table.Header(header =>
+                        {
+                            header.Cell().Element(HeaderStyle).Text("#");
+                            header.Cell().Element(HeaderStyle).Text("Returned Product");
+                            header.Cell().Element(HeaderStyle).AlignRight().Text("Unit Price");
+                            header.Cell().Element(HeaderStyle).AlignCenter().Text("Qty");
+                            header.Cell().Element(HeaderStyle).AlignRight().Text($"Total ({data.CurrencySymbol})");
+
+                            static IContainer HeaderStyle(IContainer container) => container.DefaultTextStyle(x => x.SemiBold().FontColor(Colors.White)).PaddingVertical(5).PaddingHorizontal(5).Background("#0D47A1");
+                        });
+
+                        var index = 1;
+                        foreach (var item in data.Items)
+                        {
+                            table.Cell().Element(CellStyle).Text($"{index++}");
+                            table.Cell().Element(CellStyle).Text(item.ProductName).Bold();
+                            table.Cell().Element(CellStyle).AlignRight().Text(item.UnitPrice.ToString("N2"));
+                            table.Cell().Element(CellStyle).AlignCenter().Text(item.Quantity.ToString());
+                            table.Cell().Element(CellStyle).AlignRight().Text(item.Total.ToString("N2"));
+
+                            static IContainer CellStyle(IContainer container) => container.BorderBottom(1).BorderColor("#E2E8F0").PaddingVertical(8).PaddingHorizontal(5);
+                        }
+                    });
+
+                    col.Item().PaddingTop(10).Row(row =>
+                    {
+                        row.RelativeItem().Column(c => {
+                            c.Item().Text("Notes:").FontSize(8).Bold();
+                            c.Item().Text(string.IsNullOrEmpty(data.Description) ? "-" : data.Description).FontSize(8);
+                        });
+                        row.ConstantItem(200).Column(c =>
+                        {
+                            c.Item().Row(r => { r.RelativeItem().Text("Sub Total"); r.RelativeItem().AlignRight().Text(data.BeforeTaxAmount.ToString("N2")); });
+                            c.Item().Row(r => { r.RelativeItem().Text("Tax Amount"); r.RelativeItem().AlignRight().Text(data.TaxAmount.ToString("N2")); });
+                            c.Item().PaddingTop(5).BorderTop(1).Row(r => { r.RelativeItem().Text($"TOTAL").Bold(); r.RelativeItem().AlignRight().Text(data.AfterTaxAmount.ToString("N2")).ExtraBold().FontColor(primaryBlue); });
+                        });
+                    });
+                });
+
+                page.Footer().AlignCenter().Text(x => { x.Span("Page ").FontSize(8); x.CurrentPageNumber().FontSize(8); });
+            });
+        }).GeneratePdf();
+    }
+}

Features/Sales/CreditNote/CreditNoteService.cs

@@ -0,0 +1,71 @@
+using Indotalent.ConfigBackEnd.Interfaces;
+using Indotalent.ConfigFrontEnd.Common;
+using Indotalent.Features.Sales.CreditNote.Cqrs;
+using Indotalent.Infrastructure.Authentication.Identity;
+using Indotalent.Shared.Models;
+using Microsoft.AspNetCore.Components;
+using MudBlazor;
+using RestSharp;
+
+namespace Indotalent.Features.Sales.CreditNote;
+
+public class CreditNoteService : BaseService
+{
+    private readonly RestClient _client;
+
+    public CreditNoteService(
+            IHttpClientFactory clientFactory,
+            NavigationManager nav,
+            ISnackbar snackbar,
+            ICurrentUserService currentUserService,
+            TokenProvider tokenProvider)
+            : base(clientFactory, nav, snackbar, currentUserService, tokenProvider)
+    {
+        _client = new RestClient(nav.BaseUri);
+    }
+
+    public async Task<ApiResponse<List<GetCreditNoteListResponse>>?> GetCreditNoteListAsync()
+    {
+        var request = new RestRequest("api/credit-note", Method.Get);
+        return await ExecuteWithResponseAsync<List<GetCreditNoteListResponse>>(_client, request);
+    }
+
+    public async Task<ApiResponse<GetCreditNoteByIdResponse>?> GetCreditNoteByIdAsync(string id)
+    {
+        var request = new RestRequest($"api/credit-note/{id}", Method.Get);
+        return await ExecuteWithResponseAsync<GetCreditNoteByIdResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<GetCreditNoteByIdResponse>?> GetSalesReturnDetailForCreditNoteAsync(string srId)
+    {
+        var request = new RestRequest($"api/credit-note/sales-return-detail/{srId}", Method.Get);
+        return await ExecuteWithResponseAsync<GetCreditNoteByIdResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<CreditNoteLookupResponse>?> GetCreditNoteLookupAsync()
+    {
+        var request = new RestRequest("api/credit-note/lookup", Method.Get);
+        return await ExecuteWithResponseAsync<CreditNoteLookupResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<CreateCreditNoteResponse>?> CreateCreditNoteAsync(CreateCreditNoteRequest data)
+    {
+        var request = new RestRequest("api/credit-note", Method.Post);
+        request.AddJsonBody(data);
+        return await ExecuteWithResponseAsync<CreateCreditNoteResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<bool>?> UpdateCreditNoteAsync(UpdateCreditNoteRequest data)
+    {
+        var request = new RestRequest("api/credit-note/update", Method.Post);
+        request.AddJsonBody(data);
+        return await ExecuteWithResponseAsync<bool>(_client, request);
+    }
+
+    public async Task<bool> DeleteCreditNoteByIdAsync(string id)
+    {
+        var request = new RestRequest($"api/credit-note/delete/{id}", Method.Post);
+        var response = await ExecuteWithResponseAsync<object>(_client, request);
+        return response?.IsSuccess ?? false;
+    }
+}

Features/Sales/DeliveryOrder/Components/DeliveryOrderPage.razor

@@ -0,0 +1,51 @@
+@page "/sales/delivery-order"
+@using Indotalent.Features.Sales.DeliveryOrder.Cqrs
+@using Indotalent.Features.Sales.DeliveryOrder.Components
+@using MudBlazor
+
+@if (_currentView == ViewMode.Create)
+{
+    <_DeliveryOrderCreateForm OnCancel="BackToTable" OnSuccess="HandleSuccess" />
+}
+else if (_currentView == ViewMode.Update || _currentView == ViewMode.View)
+{
+    <_DeliveryOrderUpdateForm Data="_selectedData!"
+                              ReadOnly="@(_currentView == ViewMode.View)"
+                              OnCancel="BackToTable"
+                              OnSuccess="HandleSuccess" />
+}
+else
+{
+    <_DeliveryOrderDataTable OnAdd="() => ShowCreate()"
+                             OnEdit="(item) => ShowUpdate(item, false)"
+                             OnView="(item) => ShowUpdate(item, true)" />
+}
+
+@code {
+    private enum ViewMode { Table, Create, Update, View }
+    private ViewMode _currentView = ViewMode.Table;
+    private UpdateDeliveryOrderRequest? _selectedData;
+
+    private void ShowCreate()
+    {
+        _currentView = ViewMode.Create;
+    }
+
+    private void ShowUpdate(UpdateDeliveryOrderRequest data, bool isReadOnly)
+    {
+        _selectedData = data;
+        _currentView = isReadOnly ? ViewMode.View : ViewMode.Update;
+    }
+
+    private void BackToTable()
+    {
+        _currentView = ViewMode.Table;
+        _selectedData = null;
+    }
+
+    private void HandleSuccess()
+    {
+        _currentView = ViewMode.Table;
+        _selectedData = null;
+    }
+}

Features/Sales/DeliveryOrder/Components/_DeliveryOrderCreateForm.razor

@@ -0,0 +1,129 @@
+@using Indotalent.Features.Sales.DeliveryOrder.Cqrs
+@using Indotalent.Shared.Utils
+@using MudBlazor
+@inject DeliveryOrderService DeliveryOrderService
+@inject ISnackbar Snackbar
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #DCEBFA;">
+    <div class="d-flex align-center gap-4">
+        <MudIconButton Icon="@Icons.Material.Filled.ArrowBack" OnClick="() => OnCancel.InvokeAsync()" />
+        <div>
+            <MudText Typo="Typo.h5" Style="font-weight: 900; color: #1a1a1a;">Add Delivery Order</MudText>
+            <MudText Typo="Typo.body2" Style="color: #64748b;">Initiate a new delivery process from a confirmed sales order.</MudText>
+        </div>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 4px; border: 1px solid #DCEBFA;">
+    <MudForm @ref="_form" Model="_model">
+        <MudGrid Spacing="3">
+            <MudItem xs="12"><MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Basic Information</MudText><MudDivider /></MudItem>
+            
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Delivery Date</MudText>
+                <MudDatePicker @bind-Date="_model.DeliveryDate"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Sales Order Reference</MudText>
+                <MudSelect T="string" @bind-Value="_model.SalesOrderId"
+                           For="@(() => _model.SalesOrderId)"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.SalesOrders)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Status</MudText>
+                <MudSelect T="Indotalent.Data.Enums.DeliveryOrderStatus" @bind-Value="_model.Status"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Statuses)
+                    {
+                        <MudSelectItem Value="@((Indotalent.Data.Enums.DeliveryOrderStatus)item.Value)">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Description / Shipping Notes</MudText>
+                <MudTextField @bind-Value="_model.Description"
+                              For="@(() => _model.Description)"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" Lines="3" FullWidth="true" />
+            </MudItem>
+        </MudGrid>
+
+        <div class="d-flex justify-end gap-2 mt-8">
+            <MudButton OnClick="() => OnCancel.InvokeAsync()"
+                       Variant="Variant.Outlined"
+                       Disabled="_processing"
+                       Style="border-radius: 4px; text-transform: none; font-weight: 700;border: 1px solid #e0e0e0;">
+                Cancel
+            </MudButton>
+            <MudButton Color="Color.Primary"
+                       Variant="Variant.Filled"
+                       OnClick="Submit"
+                       Disabled="_processing"
+                       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" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText>Create Delivery Order</MudText>
+                }
+            </MudButton>
+        </div>
+    </MudForm>
+</MudPaper>
+
+@code {
+    [Parameter] public EventCallback OnCancel { get; set; }
+    [Parameter] public EventCallback OnSuccess { get; set; }
+
+    private MudForm _form = default!;
+    private CreateDeliveryOrderValidator _validator = new();
+    private CreateDeliveryOrderRequest _model = new() { DeliveryDate = DateTime.Today };
+    private DeliveryOrderLookupResponse _lookup = new();
+    private bool _processing = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var res = await DeliveryOrderService.GetDeliveryOrderLookupAsync();
+        if (res != null && res.IsSuccess) _lookup = res.Value ?? new();
+    }
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+
+        _processing = true;
+        try
+        {
+            var response = await DeliveryOrderService.CreateDeliveryOrderAsync(_model);
+            await Task.Delay(500);
+
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Created successfully", Severity.Success);
+                await OnSuccess.InvokeAsync();
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _processing = false;
+        }
+    }
+}

Features/Sales/DeliveryOrder/Components/_DeliveryOrderDataTable.razor

@@ -0,0 +1,382 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.DeliveryOrder
+@using Indotalent.Features.Sales.DeliveryOrder.Cqrs
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using MudBlazor
+@using Features.Root.Shared
+@using ClosedXML.Excel
+@using System.IO
+@inject DeliveryOrderService DeliveryOrderService
+@inject IDialogService DialogService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #E5E7EB; border-radius: 12px;">
+    <div>
+        <MudText Typo="Typo.h5" Style="font-weight: 600; color: #111827;">Delivery Order</MudText>
+        <MudText Typo="Typo.body2" Style="color: #9CA3AF;">Manage shipping process and inventory stock outflows.</MudText>
+    </div>
+    <div class="d-flex align-center gap-2">
+        <MudIcon Icon="@Icons.Material.Filled.Home" Size="Size.Small" Color="Color.Default" />
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">Sales</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="font-weight: 600; color: #111827;">Delivery Order</MudText>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; overflow: hidden; background-color: #ffffff; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff; min-height: 80px;">
+        <div style="display: flex; align-items: center; gap: 8px;">
+            <MudTextField @bind-Value="_searchString"
+                          Placeholder="Search..."
+                          Adornment="Adornment.Start"
+                          AdornmentIcon="@Icons.Material.Filled.Search"
+                          IconSize="Size.Small"
+                          Class="mt-0"
+                          Variant="Variant.Outlined"
+                          Margin="Margin.Dense"
+                          Style="background-color: white; width: 280px; border-radius: 8px;"
+                          OnKeyDown="@HandleSearchKeyDown" />
+            <MudButton Variant="Variant.Filled"
+                       Color="Color.Primary"
+                       OnClick="OnSearchClick"
+                       Size="Size.Small"
+                       Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px; box-shadow: none;">
+                Search
+            </MudButton>
+        </div>
+
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Success"
+                       OnClick="ExportToExcel"
+                       Size="Size.Small"
+                       Disabled="_isExporting"
+                       StartIcon="@(_isExporting ? null : Icons.Custom.FileFormats.FileExcel)"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isExporting)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Excel</MudText>
+                }
+            </MudButton>
+
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Primary"
+                       OnClick="LoadData"
+                       Size="Size.Small"
+                       StartIcon="@(_isRefreshing ? null : Icons.Material.Filled.Refresh)"
+                       Disabled="_isRefreshing"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isRefreshing)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Refreshing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Refresh</MudText>
+                }
+            </MudButton>
+
+            @if (_selectedItem != null)
+            {
+                <MudButton Variant="Variant.Outlined" Color="Color.Info" StartIcon="@Icons.Material.Filled.Visibility" OnClick="InvokeView" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background-color: white; border: 1px solid #D1D5DB; color: #6B7280;">View</MudButton>
+                <MudButton Variant="Variant.Outlined" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Edit" OnClick="InvokeEdit" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background-color: white; border: 1px solid #D1D5DB; color: #6B7280;">Edit</MudButton>
+                <MudButton Variant="Variant.Outlined" Color="Color.Error" StartIcon="@Icons.Material.Filled.Delete" OnClick="OnDelete" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background: white; border: 1px solid #FCA5A5; color: #EF4444;">Remove</MudButton>
+                <MudIconButton Icon="@Icons.Material.Filled.Close" Size="Size.Small" OnClick="() => _selectedItem = null" />
+            }
+            else
+            {
+                <MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add" OnClick="() => OnAdd.InvokeAsync()" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px;">
+                    Add Delivery Order
+                </MudButton>
+            }
+        </div>
+    </div>
+
+    <MudTable Items="@GetPagedData()" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" CustomHeader="true" Dense="true" T="GetDeliveryOrderListResponse" OnRowClick="@((args) => _selectedItem = args.Item)" Loading="@_isRefreshing">
+        <HeaderContent>
+            <MudTh Style="width: 50px; background-color: #ffffff; border-bottom: 1px solid #E5E7EB;"></MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryOrderListResponse, object>(x => x.AutoNumber!)">Number</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryOrderListResponse, object>(x => x.DeliveryDate!)">Date</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryOrderListResponse, object>(x => x.SalesOrderNumber!)">SO Number</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryOrderListResponse, object>(x => x.Status)">Status</MudTableSortLabel>
+            </MudTh>
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd>
+                <MudCheckBox T="bool" Value="@(_selectedItem?.Id == context.Id)" Color="Color.Primary" Dense="true" Size="Size.Small" ReadOnly="true" />
+            </MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.AutoNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.DeliveryDate?.ToString("yyyy-MM-dd")</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.SalesOrderNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">
+                <MudChip T="string" Color="Color.Info" Size="Size.Small" Variant="Variant.Text" Style="font-weight: 600;">@context.Status.ToString().ToUpper()</MudChip>
+            </MudTd>
+        </RowTemplate>
+    </MudTable>
+
+    <div style="display: flex; justify-content: space-between; align-items: center; padding: 12px 24px; background-color: #F9FAFB; border-top: 1px solid #E5E7EB;">
+        <div style="display: flex; align-items: center; gap: 12px;">
+            <MudText Typo="Typo.caption" Style="font-weight: 500; color: #9CA3AF; font-size: 0.75rem;">Rows per page:</MudText>
+            <MudSelect T="int" Value="@_top" ValueChanged="OnPageSizeChanged" Dense="true" Margin="Margin.Dense" Style="width: 80px; background-color: white; font-size: 12px; font-weight: 600;" Variant="Variant.Outlined" Class="mt-0 custom-select-dense">
+                <MudSelectItem Value="5" />
+                <MudSelectItem Value="10" />
+                <MudSelectItem Value="50" />
+                <MudSelectItem Value="500" />
+                <MudSelectItem Value="1000" />
+            </MudSelect>
+            <MudText Typo="Typo.caption" Style="color: #9CA3AF; margin-left: 12px; font-size: 0.75rem; font-weight: 500;">
+                Showing @(GetFilteredData().Count() == 0 ? 0 : _skip + 1)-@Math.Min(_skip + _top, GetFilteredData().Count()) of @GetFilteredData().Count()
+            </MudText>
+        </div>
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudIconButton Icon="@Icons.Material.Filled.FirstPage" Size="Size.Small" OnClick="@(() => OnPageChanged(1))" Disabled="@(_currentPage == 1)" Style="@(_currentPage == 1 ? "color: #D1D5DB; background: transparent;" : "color: #6B7280; background: white; border: 1px solid #D1D5DB; border-radius: 6px;")" />
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage - 1))" Disabled="@(_currentPage == 1)" Variant="Variant.Text" StartIcon="@Icons.Material.Filled.ChevronLeft" Size="Size.Small" Style="@(_currentPage == 1 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Prev</MudButton>
+            @{
+                var totalPages = _totalPage == 0 ? 1 : _totalPage;
+                var maxVisible = 5;
+                var startPage = Math.Max(1, _currentPage - maxVisible / 2);
+                var endPage = Math.Min(totalPages, startPage + maxVisible - 1);
+                if (endPage - startPage < maxVisible - 1) { startPage = Math.Max(1, endPage - maxVisible + 1); }
+            }
+            @for (int i = startPage; i <= endPage; i++)
+            {
+                var pageNum = i;
+                var isActive = pageNum == _currentPage;
+                <MudButton OnClick="@(() => OnPageChanged(pageNum))"
+                           Variant="Variant.Text" Size="Size.Small"
+                           Style="@(isActive ? "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 600; background: #3B82F6; color: white; border: 1px solid #3B82F6; border-radius: 6px; text-transform: none;" : "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 500; color: #374151; background: white; border: 1px solid #D1D5DB; border-radius: 6px; text-transform: none;")">@pageNum</MudButton>
+            }
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage + 1))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Variant="Variant.Text" EndIcon="@Icons.Material.Filled.ChevronRight" Size="Size.Small" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Next</MudButton>
+            <MudIconButton Icon="@Icons.Material.Filled.LastPage" Size="Size.Small" OnClick="@(() => OnPageChanged(_totalPage))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "color: #D1D5DB; background: transparent;" : "background-color: white; border: 1px solid #D1D5DB; color: #6B7280;")" />
+        </div>
+    </div>
+</MudPaper>
+
+
+<script>
+    function downloadFile(fileName, contentType, base64String) {
+        const link = document.createElement('a');
+        link.download = fileName;
+        link.href = `data:${contentType};base64,${base64String}`;
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+    }
+</script>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    [Parameter] public EventCallback OnAdd { get; set; }
+    [Parameter] public EventCallback<UpdateDeliveryOrderRequest> OnEdit { get; set; }
+    [Parameter] public EventCallback<UpdateDeliveryOrderRequest> OnView { get; set; }
+
+    private List<GetDeliveryOrderListResponse> _items = new();
+    private GetDeliveryOrderListResponse? _selectedItem;
+    private string _searchString = "";
+    private bool _isRefreshing = false;
+    private bool _isExporting = false;
+
+    private int _skip = 0;
+    private int _top = 5;
+    private int _totalPage => GetFilteredData().Count() == 0 ? 0 : (int)Math.Ceiling((double)GetFilteredData().Count() / (_top == 0 ? 1 : _top));
+    private int _currentPage => (_top >= GetFilteredData().Count() || _top == 0) ? 1 : (_skip / _top) + 1;
+
+    protected override async Task OnInitializedAsync() => await LoadData();
+
+    private async Task LoadData()
+    {
+        _isRefreshing = true;
+        _selectedItem = null;
+        StateHasChanged();
+        try
+        {
+            var response = await DeliveryOrderService.GetDeliveryOrderListAsync();
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                _items = response.Value ?? new();
+            }
+        }
+        finally
+        {
+            _isRefreshing = false;
+            StateHasChanged();
+        }
+    }
+
+    private IEnumerable<GetDeliveryOrderListResponse> GetFilteredData()
+    {
+        if (string.IsNullOrWhiteSpace(_searchString)) return _items;
+        return _items.Where(x =>
+            (x.AutoNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.SalesOrderNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false)
+        );
+    }
+
+    private IEnumerable<GetDeliveryOrderListResponse> GetPagedData() => GetFilteredData().Skip(_skip).Take(_top);
+
+    private void OnSearchClick()
+    {
+        _skip = 0;
+        _selectedItem = null;
+        StateHasChanged();
+    }
+
+    private void HandleSearchKeyDown(KeyboardEventArgs e)
+    {
+        if (e.Key == "Enter") OnSearchClick();
+    }
+
+    private async Task ExportToExcel()
+    {
+        _isExporting = true;
+        StateHasChanged();
+        try
+        {
+            await Task.Delay(1000);
+            using (var workbook = new XLWorkbook())
+            {
+                var worksheet = workbook.Worksheets.Add("DeliveryOrders");
+                var currentRow = 1;
+
+                worksheet.Cell(currentRow, 1).Value = "Number";
+                worksheet.Cell(currentRow, 2).Value = "Date";
+                worksheet.Cell(currentRow, 3).Value = "SO Reference";
+                worksheet.Cell(currentRow, 4).Value = "Status";
+
+                var headerRange = worksheet.Range(1, 1, 1, 4);
+                headerRange.Style.Font.Bold = true;
+                headerRange.Style.Fill.BackgroundColor = XLColor.FromHtml("#0D47A1");
+                headerRange.Style.Font.FontColor = XLColor.White;
+
+                foreach (var item in GetFilteredData())
+                {
+                    currentRow++;
+                    worksheet.Cell(currentRow, 1).Value = item.AutoNumber;
+                    worksheet.Cell(currentRow, 2).Value = item.DeliveryDate?.ToString("yyyy-MM-dd");
+                    worksheet.Cell(currentRow, 3).Value = item.SalesOrderNumber;
+                    worksheet.Cell(currentRow, 4).Value = item.Status.ToString();
+                }
+
+                worksheet.Columns().AdjustToContents();
+
+                using (var stream = new MemoryStream())
+                {
+                    workbook.SaveAs(stream);
+                    var content = Convert.ToBase64String(stream.ToArray());
+                    await JSRuntime.InvokeVoidAsync("downloadFile", "DO_List.xlsx", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", content);
+                    Snackbar.Add("Excel exported successfully", Severity.Success);
+                }
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Export failed: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _isExporting = false;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageChanged(int page)
+    {
+        if (page >= 1 && page <= _totalPage)
+        {
+            _skip = (page - 1) * _top;
+            _selectedItem = null;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageSizeChanged(int size)
+    {
+        _top = size;
+        _skip = 0;
+        _selectedItem = null;
+        StateHasChanged();
+    }
+
+    private async Task InvokeEdit()
+    {
+        if (_selectedItem == null) return;
+        var request = await MapToUpdateRequest(_selectedItem.Id!);
+        if (request != null) await OnEdit.InvokeAsync(request);
+    }
+
+    private async Task InvokeView()
+    {
+        if (_selectedItem == null) return;
+        var request = await MapToUpdateRequest(_selectedItem.Id!);
+        if (request != null) await OnView.InvokeAsync(request);
+    }
+
+    private async Task<UpdateDeliveryOrderRequest?> MapToUpdateRequest(string id)
+    {
+        var response = await DeliveryOrderService.GetDeliveryOrderByIdAsync(id);
+        if (response != null && response.IsSuccess && response.Value != null)
+        {
+            var detail = response.Value;
+            return new UpdateDeliveryOrderRequest
+            {
+                Id = detail.Id,
+                DeliveryDate = detail.DeliveryDate,
+                Status = detail.Status,
+                Description = detail.Description,
+                SalesOrderId = detail.SalesOrderId,
+                CreatedAt = detail.CreatedAt,
+                CreatedBy = detail.CreatedBy,
+                UpdatedAt = detail.UpdatedAt,
+                UpdatedBy = detail.UpdatedBy,
+                AutoNumber = detail.AutoNumber
+            };
+        }
+        return null;
+    }
+
+    private async Task OnDelete()
+    {
+        if (_selectedItem == null) return;
+
+        var parameters = new DialogParameters<_DeleteConfirmation> { { x => x.ContentText, _selectedItem.AutoNumber } };
+        var options = new DialogOptions { CloseButton = false, MaxWidth = MaxWidth.ExtraSmall, FullWidth = true };
+
+        var dialog = await DialogService.ShowAsync<_DeleteConfirmation>("", parameters, options);
+        var result = await dialog.Result;
+
+        if (result != null && !result.Canceled)
+        {
+            var isSuccess = await DeliveryOrderService.DeleteDeliveryOrderByIdAsync(_selectedItem.Id!);
+            if (isSuccess)
+            {
+                _selectedItem = null;
+                await LoadData();
+                Snackbar.Add("Deleted successfully", Severity.Success);
+            }
+        }
+    }
+}

Features/Sales/DeliveryOrder/Components/_DeliveryOrderItemCreateForm.razor

@@ -0,0 +1,89 @@
+@using Indotalent.Features.Sales.DeliveryOrder.Cqrs
+@using MudBlazor
+@inject DeliveryOrderService DeliveryOrderService
+@inject ISnackbar Snackbar
+
+<MudDialog>
+    <DialogContent>
+        <MudForm @ref="_form" Model="_model">
+            <MudGrid Spacing="2">
+                <MudItem xs="12">
+                    <MudText Typo="Typo.subtitle2" Class="mb-0">Product</MudText>
+                    <MudSelect T="string" @bind-Value="_model.ProductId"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true"
+                               AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                        @foreach (var item in _lookup.Products)
+                        {
+                            <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                        }
+                    </MudSelect>
+                </MudItem>
+                <MudItem xs="12">
+                    <MudText Typo="Typo.subtitle2" Class="mb-0">Warehouse</MudText>
+                    <MudSelect T="string" @bind-Value="_model.WarehouseId"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true"
+                               AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                        @foreach (var item in _lookup.Warehouses)
+                        {
+                            <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                        }
+                    </MudSelect>
+                </MudItem>
+                <MudItem xs="12">
+                    <MudText Typo="Typo.subtitle2" Class="mb-1">Movement Quantity</MudText>
+                    <MudNumericField @bind-Value="_model.Movement" Variant="Variant.Outlined" Margin="Margin.Dense" />
+                </MudItem>
+            </MudGrid>
+        </MudForm>
+    </DialogContent>
+    <DialogActions>
+        <MudButton OnClick="Cancel" Variant="Variant.Text">Cancel</MudButton>
+        <MudButton Color="Color.Primary" OnClick="Submit" Variant="Variant.Filled" Disabled="_processing" Style="text-transform: none; font-weight: 700; border-radius: 4px;">
+            @if (_processing)
+            {
+                <MudProgressCircular Size="Size.Small" Indeterminate="true" />
+                <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+            }
+            else
+            {
+                <MudText>Add Line</MudText>
+            }
+        </MudButton>
+    </DialogActions>
+</MudDialog>
+
+@code {
+    [CascadingParameter] IMudDialogInstance MudDialog { get; set; } = default!;
+    [Parameter] public string DeliveryOrderId { get; set; } = string.Empty;
+    private MudForm _form = default!;
+    private CreateDeliveryOrderItemRequest _model = new() { Movement = 1 };
+    private DeliveryOrderLookupResponse _lookup = new();
+    private bool _processing = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var res = await DeliveryOrderService.GetDeliveryOrderLookupAsync();
+        if (res != null && res.IsSuccess) _lookup = res.Value ?? new();
+        _model.DeliveryOrderId = DeliveryOrderId;
+    }
+
+    private void Cancel() => MudDialog.Cancel();
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+        _processing = true;
+        try
+        {
+            var response = await DeliveryOrderService.CreateDeliveryOrderItemAsync(_model);
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Line added successfully", Severity.Success);
+                MudDialog.Close(DialogResult.Ok(true));
+            }
+        }
+        finally { _processing = false; }
+    }
+}

Features/Sales/DeliveryOrder/Components/_DeliveryOrderItemDataTable.razor

@@ -0,0 +1,93 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.DeliveryOrder
+@using Indotalent.Features.Sales.DeliveryOrder.Cqrs
+@using MudBlazor
+@using Indotalent.Features.Root.Shared
+@inject DeliveryOrderService DeliveryOrderService
+@inject IDialogService DialogService
+@inject ISnackbar Snackbar
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff;">
+        <MudText Typo="Typo.button" Color="Color.Default" Style="font-weight: 600; color: #111827;">Items List</MudText>
+        @if (!ReadOnly)
+        {
+            <MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add" OnClick="OnAddClick" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px;">
+                Add Movement Line
+            </MudButton>
+        }
+    </div>
+
+    <MudTable Items="Items" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" Dense="true" T="DeliveryOrderInvenTransResponse">
+        <HeaderContent>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">Product</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">Warehouse</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Quantity</MudTh>
+            @if (!ReadOnly)
+            {
+                <MudTh Style="width: 100px; text-align: right; font-weight: 600; color: #6B7280;">Actions</MudTh>
+            }
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd DataLabel="Product">@context.ProductName</MudTd>
+            <MudTd DataLabel="Warehouse">@context.WarehouseName</MudTd>
+            <MudTd DataLabel="Quantity" Style="text-align: right; font-weight: 700;">@context.Movement</MudTd>
+            @if (!ReadOnly)
+            {
+                <MudTd Style="text-align: right;">
+                    <MudIconButton Icon="@Icons.Material.Filled.Edit" Size="Size.Small" Color="Color.Primary" OnClick="@(() => OnEditClick(context))" />
+                    <MudIconButton Icon="@Icons.Material.Filled.Delete" Size="Size.Small" Color="Color.Error" OnClick="@(() => OnDeleteClick(context))" />
+                </MudTd>
+            }
+        </RowTemplate>
+    </MudTable>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    [Parameter] public string DeliveryOrderId { get; set; } = string.Empty;
+    [Parameter] public List<DeliveryOrderInvenTransResponse> Items { get; set; } = new();
+    [Parameter] public bool ReadOnly { get; set; } = false;
+    [Parameter] public EventCallback OnChanged { get; set; }
+
+    private async Task OnAddClick()
+    {
+        var parameters = new DialogParameters { ["DeliveryOrderId"] = DeliveryOrderId };
+        var options = new DialogOptions { MaxWidth = MaxWidth.Small, FullWidth = true, CloseButton = true };
+        var dialog = await DialogService.ShowAsync<_DeliveryOrderItemCreateForm>("Add Item Movement", parameters, options);
+        var result = await dialog.Result;
+        if (result != null && !result.Canceled) await OnChanged.InvokeAsync();
+    }
+
+    private async Task OnEditClick(DeliveryOrderInvenTransResponse item)
+    {
+        var parameters = new DialogParameters { ["Data"] = item };
+        var options = new DialogOptions { MaxWidth = MaxWidth.Small, FullWidth = true, CloseButton = true };
+        var dialog = await DialogService.ShowAsync<_DeliveryOrderItemUpdateForm>("Edit Item Movement", parameters, options);
+        var result = await dialog.Result;
+        if (result != null && !result.Canceled) await OnChanged.InvokeAsync();
+    }
+
+    private async Task OnDeleteClick(DeliveryOrderInvenTransResponse item)
+    {
+        var parameters = new DialogParameters { ["ContentText"] = $"Are you sure you want to remove this movement item?" };
+        var dialog = await DialogService.ShowAsync<_DeleteConfirmation>("Delete Confirmation", parameters, new DialogOptions { MaxWidth = MaxWidth.ExtraSmall, FullWidth = true });
+        var result = await dialog.Result;
+        if (result != null && !result.Canceled)
+        {
+            var success = await DeliveryOrderService.DeleteDeliveryOrderItemAsync(item.Id!);
+            if (success)
+            {
+                Snackbar.Add("Removed successfully", Severity.Success);
+                await OnChanged.InvokeAsync();
+            }
+        }
+    }
+}

Features/Sales/DeliveryOrder/Components/_DeliveryOrderItemUpdateForm.razor

@@ -0,0 +1,93 @@
+@using Indotalent.Features.Sales.DeliveryOrder.Cqrs
+@using MudBlazor
+@inject DeliveryOrderService DeliveryOrderService
+@inject ISnackbar Snackbar
+
+<MudDialog>
+    <DialogContent>
+        <MudForm @ref="_form" Model="_model">
+            <MudGrid Spacing="2">
+                <MudItem xs="12">
+                    <MudText Typo="Typo.subtitle2" Class="mb-0">Product</MudText>
+                    <MudSelect T="string" @bind-Value="_model.ProductId"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true"
+                               AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                        @foreach (var item in _lookup.Products)
+                        {
+                            <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                        }
+                    </MudSelect>
+                </MudItem>
+                <MudItem xs="12">
+                    <MudText Typo="Typo.subtitle2" Class="mb-0">Warehouse</MudText>
+                    <MudSelect T="string" @bind-Value="_model.WarehouseId"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true"
+                               AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                        @foreach (var item in _lookup.Warehouses)
+                        {
+                            <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                        }
+                    </MudSelect>
+                </MudItem>
+                <MudItem xs="12">
+                    <MudText Typo="Typo.subtitle2" Class="mb-1">Movement Quantity</MudText>
+                    <MudNumericField @bind-Value="_model.Movement" Variant="Variant.Outlined" Margin="Margin.Dense" />
+                </MudItem>
+            </MudGrid>
+        </MudForm>
+    </DialogContent>
+    <DialogActions>
+        <MudButton OnClick="Cancel" Variant="Variant.Text">Cancel</MudButton>
+        <MudButton Color="Color.Primary" OnClick="Submit" Variant="Variant.Filled" Disabled="_processing" Style="text-transform: none; font-weight: 700; border-radius: 4px;">
+            @if (_processing)
+            {
+                <MudProgressCircular Size="Size.Small" Indeterminate="true" />
+                <MudText Class="ms-2">Updating...</MudText>
+            }
+            else
+            {
+                <MudText>Save Changes</MudText>
+            }
+        </MudButton>
+    </DialogActions>
+</MudDialog>
+
+@code {
+    [CascadingParameter] IMudDialogInstance MudDialog { get; set; } = default!;
+    [Parameter] public DeliveryOrderInvenTransResponse Data { get; set; } = new();
+    private MudForm _form = default!;
+    private UpdateDeliveryOrderItemRequest _model = new();
+    private DeliveryOrderLookupResponse _lookup = new();
+    private bool _processing = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var res = await DeliveryOrderService.GetDeliveryOrderLookupAsync();
+        if (res != null && res.IsSuccess) _lookup = res.Value ?? new();
+
+        _model.Id = Data.Id;
+        _model.ProductId = Data.ProductId;
+        _model.WarehouseId = Data.WarehouseId;
+        _model.Movement = Data.Movement;
+    }
+
+    private void Cancel() => MudDialog.Cancel();
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+        _processing = true;
+        try
+        {
+            var response = await DeliveryOrderService.UpdateDeliveryOrderItemAsync(_model);
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Line updated successfully", Severity.Success);
+                MudDialog.Close(DialogResult.Ok(true));
+            }
+        }
+        finally { _processing = false; }
+    }
+}

Features/Sales/DeliveryOrder/Components/_DeliveryOrderUpdateForm.razor

@@ -0,0 +1,263 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.DeliveryOrder.Cqrs
+@using Indotalent.Features.Sales.DeliveryOrder.Components
+@using Indotalent.Shared.Utils
+@using MudBlazor
+@using Microsoft.JSInterop
+@inject DeliveryOrderService DeliveryOrderService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #DCEBFA;">
+    <div class="d-flex align-center gap-4">
+        <MudIconButton Icon="@Icons.Material.Filled.ArrowBack" OnClick="() => OnCancel.InvokeAsync()" />
+        <div>
+            <MudText Typo="Typo.h5" Style="font-weight: 900; color: #1a1a1a;">@(ReadOnly ? "Details" : "Edit") Delivery Order</MudText>
+            <MudText Typo="Typo.body2" Style="color: #64748b;">@_model.AutoNumber</MudText>
+        </div>
+    </div>
+    @if (ReadOnly || !string.IsNullOrEmpty(_model.Id))
+    {
+        <MudButton Variant="Variant.Filled"
+                   Color="Color.Info"
+                   StartIcon="@(_isPrinting ? null : Icons.Material.Filled.Print)"
+                   OnClick="DownloadPdf"
+                   Disabled="_isPrinting"
+                   Style="border-radius: 4px; text-transform: none; font-weight: 700; box-shadow: none;">
+            @if (_isPrinting)
+            {
+                <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                <MudText Class="ms-2">Generating PDF...</MudText>
+            }
+            else
+            {
+                <MudText>Print PDF</MudText>
+            }
+        </MudButton>
+    }
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 4px; border: 1px solid #DCEBFA;">
+    <MudForm @ref="_form" Model="_model">
+        <MudGrid Spacing="3">
+            <MudItem xs="12"><MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Basic Information</MudText><MudDivider /></MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Delivery Date</MudText>
+                <MudDatePicker @bind-Date="_model.DeliveryDate" ReadOnly="ReadOnly"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Sales Order Reference</MudText>
+                <MudSelect T="string" @bind-Value="_model.SalesOrderId"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.SalesOrders)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Status</MudText>
+                <MudSelect T="Indotalent.Data.Enums.DeliveryOrderStatus" @bind-Value="_model.Status"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Statuses)
+                    {
+                        <MudSelectItem Value="@((Indotalent.Data.Enums.DeliveryOrderStatus)item.Value)">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Description / Shipping Notes</MudText>
+                <MudTextField @bind-Value="_model.Description"
+                              ReadOnly="ReadOnly"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-6">
+                <_DeliveryOrderItemDataTable Items="_items" DeliveryOrderId="@(_model.Id ?? string.Empty)" ReadOnly="ReadOnly" OnChanged="RefreshItems" />
+            </MudItem>
+
+            <MudItem xs="12" sm="7"></MudItem>
+            <MudItem xs="12" sm="5">
+                <MudPaper Elevation="0" Outlined="true" Class="pa-4" Style="border-radius: 4px; background-color: #F8FAFC; border: 1px solid #DCEBFA;">
+                    <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;" Class="mb-4 d-block">Movement Summary</MudText>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Total Items</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_items.Count</MudText>
+                    </div>
+                    <div class="d-flex justify-space-between">
+                        <MudText Typo="Typo.body2">Total Movement Quantity</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_items.Sum(x => x.Movement)</MudText>
+                    </div>
+                    <MudDivider Class="my-2" />
+                    <div class="d-flex justify-space-between">
+                        <MudText Typo="Typo.subtitle2" Style="font-weight: 900;">Status</MudText>
+                        <MudText Typo="Typo.subtitle2" Color="Color.Primary" Style="font-weight: 900;">@_model.Status.ToString().ToUpper()</MudText>
+                    </div>
+                </MudPaper>
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-4">
+                <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Audit History</MudText>
+                <MudDivider Class="mt-2 mb-4" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Created At</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@DateTimeExtensions.ToString(_model.CreatedAt)</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Created By</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@(!string.IsNullOrEmpty(_model.CreatedBy) ? _model.CreatedBy : "System")</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Last Updated At</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@DateTimeExtensions.ToString(_model.UpdatedAt)</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Last Updated By</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@(!string.IsNullOrEmpty(_model.UpdatedBy) ? _model.UpdatedBy : "System")</MudText>
+            </MudItem>
+        </MudGrid>
+
+        <div class="d-flex justify-end gap-2 mt-10">
+            <MudButton OnClick="() => OnCancel.InvokeAsync()"
+                       Variant="Variant.Outlined"
+                       Disabled="_processing"
+                       Style="border-radius: 4px; text-transform: none; font-weight: 700;border: 1px solid #e0e0e0;">
+                @(ReadOnly ? "Back to List" : "Cancel")
+            </MudButton>
+            @if (!ReadOnly)
+            {
+                <MudButton Color="Color.Primary"
+                           Variant="Variant.Filled"
+                           OnClick="Submit"
+                           Disabled="_processing"
+                           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>Save Changes</MudText>
+                    }
+                </MudButton>
+            }
+        </div>
+    </MudForm>
+</MudPaper>
+
+@code {
+    [Parameter] public UpdateDeliveryOrderRequest Data { get; set; } = new();
+    [Parameter] public bool ReadOnly { get; set; } = false;
+    [Parameter] public EventCallback OnCancel { get; set; }
+    [Parameter] public EventCallback OnSuccess { get; set; }
+
+    private MudForm _form = default!;
+    private UpdateDeliveryOrderValidator _validator = new();
+    private UpdateDeliveryOrderRequest _model = new();
+    private List<DeliveryOrderInvenTransResponse> _items = new();
+    private DeliveryOrderLookupResponse _lookup = new();
+    private bool _processing = false;
+    private bool _isPrinting = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var resLookup = await DeliveryOrderService.GetDeliveryOrderLookupAsync();
+        if (resLookup != null && resLookup.IsSuccess) _lookup = resLookup.Value ?? new();
+
+        _model = Data;
+        await RefreshItems();
+    }
+
+    private async Task RefreshItems()
+    {
+        try
+        {
+            var response = await DeliveryOrderService.GetDeliveryOrderByIdAsync(_model.Id!);
+            await Task.Delay(500);
+            
+            if (response != null && response.IsSuccess && response.Value != null)
+            {
+                _items = response.Value.Items ?? new();
+                StateHasChanged();
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+    }
+
+    private async Task DownloadPdf()
+    {
+        try
+        {
+            _isPrinting = true;
+            StateHasChanged();
+
+            await Task.Delay(1000);
+
+            var response = await DeliveryOrderService.GetDeliveryOrderByIdAsync(_model.Id!);
+            if (response != null && response.IsSuccess && response.Value != null)
+            {
+                var pdfBytes = DeliveryOrderPdfGenerator.Generate(response.Value);
+                var fileName = $"DO_{response.Value.AutoNumber}.pdf";
+                var base64 = Convert.ToBase64String(pdfBytes);
+                await JSRuntime.InvokeVoidAsync("downloadFile", fileName, "application/pdf", base64);
+                Snackbar.Add("PDF generated successfully.", Severity.Success);
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _isPrinting = false;
+            StateHasChanged();
+        }
+    }
+
+    private async Task Submit()
+    {
+        if (ReadOnly) return;
+        
+        await _form.Validate();
+        if (!_form.IsValid) return;
+
+        _processing = true;
+        StateHasChanged();
+        
+        try
+        {
+            var response = await DeliveryOrderService.UpdateDeliveryOrderAsync(_model);
+            await Task.Delay(500);
+
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Updated successfully", Severity.Success);
+                await OnSuccess.InvokeAsync();
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _processing = false;
+            StateHasChanged();
+        }
+    }
+}

Features/Sales/DeliveryOrder/Cqrs/CreateDeliveryOrderHandler.cs

@@ -0,0 +1,55 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Infrastructure.Database;
+using MediatR;
+
+namespace Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+public class CreateDeliveryOrderRequest
+{
+    public DateTime? DeliveryDate { get; set; }
+    public Data.Enums.DeliveryOrderStatus Status { get; set; }
+    public string? Description { get; set; }
+    public string? SalesOrderId { get; set; }
+}
+
+public class CreateDeliveryOrderResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+}
+
+public record CreateDeliveryOrderCommand(CreateDeliveryOrderRequest Data) : IRequest<CreateDeliveryOrderResponse>;
+
+public class CreateDeliveryOrderHandler : IRequestHandler<CreateDeliveryOrderCommand, CreateDeliveryOrderResponse>
+{
+    private readonly AppDbContext _context;
+    public CreateDeliveryOrderHandler(AppDbContext context) => _context = context;
+
+    public async Task<CreateDeliveryOrderResponse> Handle(CreateDeliveryOrderCommand request, CancellationToken cancellationToken)
+    {
+        var entityName = nameof(Data.Entities.DeliveryOrder);
+        var autoNo = await _context.GenerateAutoNumberAsync(
+            entityName: entityName,
+            prefixTemplate: $"{entityName.ToShortNameConsonant(3)}/{{Year}}/",
+            ct: cancellationToken
+        );
+
+        var entity = new Data.Entities.DeliveryOrder
+        {
+            AutoNumber = autoNo,
+            DeliveryDate = request.Data.DeliveryDate,
+            Status = request.Data.Status,
+            Description = request.Data.Description,
+            SalesOrderId = request.Data.SalesOrderId
+        };
+
+        _context.DeliveryOrder.Add(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+
+        return new CreateDeliveryOrderResponse
+        {
+            Id = entity.Id,
+            AutoNumber = entity.AutoNumber
+        };
+    }
+}

Features/Sales/DeliveryOrder/Cqrs/CreateDeliveryOrderItemHandler.cs

@@ -0,0 +1,58 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+public class CreateDeliveryOrderItemRequest
+{
+    public string? DeliveryOrderId { get; set; }
+    public string? WarehouseId { get; set; }
+    public string? ProductId { get; set; }
+    public double? Movement { get; set; }
+}
+
+public record CreateDeliveryOrderItemCommand(CreateDeliveryOrderItemRequest Data) : IRequest<bool>;
+
+public class CreateDeliveryOrderItemHandler : IRequestHandler<CreateDeliveryOrderItemCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public CreateDeliveryOrderItemHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(CreateDeliveryOrderItemCommand request, CancellationToken cancellationToken)
+    {
+        var parent = await _context.DeliveryOrder
+            .AsNoTracking()
+            .FirstOrDefaultAsync(x => x.Id == request.Data.DeliveryOrderId, cancellationToken);
+
+        if (parent == null) return false;
+
+        var ivtEntityName = nameof(Data.Entities.InventoryTransaction);
+        var autoNo = await _context.GenerateAutoNumberAsync(
+            entityName: ivtEntityName,
+            prefixTemplate: $"{ivtEntityName.ToShortNameConsonant(3)}/{{Year}}/",
+            ct: cancellationToken
+        );
+
+        var entity = new Data.Entities.InventoryTransaction
+        {
+            AutoNumber = autoNo,
+            ModuleId = parent.Id,
+            ModuleName = nameof(Data.Entities.DeliveryOrder),
+            ModuleCode = "DO",
+            ModuleNumber = parent.AutoNumber,
+            MovementDate = parent.DeliveryDate ?? DateTime.Now,
+            Status = (Data.Enums.InventoryTransactionStatus)parent.Status,
+            WarehouseId = request.Data.WarehouseId,
+            ProductId = request.Data.ProductId,
+            Movement = request.Data.Movement
+        };
+
+        _context.CalculateInvenTrans(entity);
+        _context.InventoryTransaction.Add(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+
+        return true;
+    }
+}

Features/Sales/DeliveryOrder/Cqrs/CreateDeliveryOrderValidator.cs

@@ -0,0 +1,12 @@
+using FluentValidation;
+
+namespace Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+public class CreateDeliveryOrderValidator : AbstractValidator<CreateDeliveryOrderRequest>
+{
+    public CreateDeliveryOrderValidator()
+    {
+        RuleFor(x => x.DeliveryDate).NotEmpty().WithMessage("Delivery Date is required");
+        RuleFor(x => x.SalesOrderId).NotEmpty().WithMessage("Sales Order reference is required");
+    }
+}

Features/Sales/DeliveryOrder/Cqrs/DeleteDeliveryOrderByIdHandler.cs

@@ -0,0 +1,31 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+public record DeleteDeliveryOrderByIdCommand(string Id) : IRequest<bool>;
+
+public class DeleteDeliveryOrderByIdHandler : IRequestHandler<DeleteDeliveryOrderByIdCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public DeleteDeliveryOrderByIdHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(DeleteDeliveryOrderByIdCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.DeliveryOrder
+            .FirstOrDefaultAsync(x => x.Id == request.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        var transactions = await _context.InventoryTransaction
+            .Where(x => x.ModuleId == entity.Id && x.ModuleName == nameof(Data.Entities.DeliveryOrder))
+            .ToListAsync(cancellationToken);
+
+        _context.InventoryTransaction.RemoveRange(transactions);
+        _context.DeliveryOrder.Remove(entity);
+
+        await _context.SaveChangesAsync(cancellationToken);
+        return true;
+    }
+}

Features/Sales/DeliveryOrder/Cqrs/DeleteDeliveryOrderItemHandler.cs

@@ -0,0 +1,26 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+public record DeleteDeliveryOrderItemCommand(string Id) : IRequest<bool>;
+
+public class DeleteDeliveryOrderItemHandler : IRequestHandler<DeleteDeliveryOrderItemCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public DeleteDeliveryOrderItemHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(DeleteDeliveryOrderItemCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.InventoryTransaction
+            .FirstOrDefaultAsync(x => x.Id == request.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        _context.InventoryTransaction.Remove(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+
+        return true;
+    }
+}

Features/Sales/DeliveryOrder/Cqrs/GetDeliveryOrderByIdHandler.cs

@@ -0,0 +1,81 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+public class DeliveryOrderInvenTransResponse
+{
+    public string? Id { get; set; }
+    public string? ProductId { get; set; }
+    public string? ProductName { get; set; }
+    public string? WarehouseId { get; set; }
+    public string? WarehouseName { get; set; }
+    public double? Movement { get; set; }
+}
+
+public class GetDeliveryOrderByIdResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+    public DateTime? DeliveryDate { get; set; }
+    public Data.Enums.DeliveryOrderStatus Status { get; set; }
+    public string? Description { get; set; }
+    public string? SalesOrderId { get; set; }
+    public string? SalesOrderNumber { get; set; }
+    public DateTimeOffset? CreatedAt { get; set; }
+    public string? CreatedBy { get; set; }
+    public DateTimeOffset? UpdatedAt { get; set; }
+    public string? UpdatedBy { get; set; }
+    public List<DeliveryOrderInvenTransResponse> Items { get; set; } = new();
+}
+
+public record GetDeliveryOrderByIdQuery(string Id) : IRequest<GetDeliveryOrderByIdResponse?>;
+
+public class GetDeliveryOrderByIdHandler : IRequestHandler<GetDeliveryOrderByIdQuery, GetDeliveryOrderByIdResponse?>
+{
+    private readonly AppDbContext _context;
+    public GetDeliveryOrderByIdHandler(AppDbContext context) => _context = context;
+
+    public async Task<GetDeliveryOrderByIdResponse?> Handle(GetDeliveryOrderByIdQuery request, CancellationToken cancellationToken)
+    {
+        var master = await _context.DeliveryOrder
+            .AsNoTracking()
+            .Include(x => x.SalesOrder)
+            .FirstOrDefaultAsync(x => x.Id == request.Id, cancellationToken);
+
+        if (master == null) return null;
+
+        var details = await _context.InventoryTransaction
+            .AsNoTracking()
+            .Include(x => x.Product)
+            .Include(x => x.Warehouse)
+            .Where(x => x.ModuleId == request.Id && x.ModuleName == nameof(Data.Entities.DeliveryOrder))
+            .Select(x => new DeliveryOrderInvenTransResponse
+            {
+                Id = x.Id,
+                ProductId = x.ProductId,
+                ProductName = x.Product!.Name,
+                WarehouseId = x.WarehouseId,
+                WarehouseName = x.Warehouse!.Name,
+                Movement = x.Movement
+            })
+            .ToListAsync(cancellationToken);
+
+        return new GetDeliveryOrderByIdResponse
+        {
+            Id = master.Id,
+            AutoNumber = master.AutoNumber,
+            DeliveryDate = master.DeliveryDate,
+            Status = master.Status,
+            Description = master.Description,
+            SalesOrderId = master.SalesOrderId,
+            SalesOrderNumber = master.SalesOrder?.AutoNumber,
+            CreatedAt = master.CreatedAt,
+            CreatedBy = master.CreatedBy,
+            UpdatedAt = master.UpdatedAt,
+            UpdatedBy = master.UpdatedBy,
+            Items = details
+        };
+    }
+}

Features/Sales/DeliveryOrder/Cqrs/GetDeliveryOrderListHandler.cs

@@ -0,0 +1,38 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+public class GetDeliveryOrderListResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+    public DateTime? DeliveryDate { get; set; }
+    public string? SalesOrderNumber { get; set; }
+    public Data.Enums.DeliveryOrderStatus Status { get; set; }
+}
+
+public record GetDeliveryOrderListQuery() : IRequest<List<GetDeliveryOrderListResponse>>;
+
+public class GetDeliveryOrderListHandler : IRequestHandler<GetDeliveryOrderListQuery, List<GetDeliveryOrderListResponse>>
+{
+    private readonly AppDbContext _context;
+    public GetDeliveryOrderListHandler(AppDbContext context) => _context = context;
+
+    public async Task<List<GetDeliveryOrderListResponse>> Handle(GetDeliveryOrderListQuery request, CancellationToken cancellationToken)
+    {
+        return await _context.DeliveryOrder
+            .AsNoTracking()
+            .Include(x => x.SalesOrder)
+            .OrderByDescending(x => x.CreatedAt)
+            .Select(x => new GetDeliveryOrderListResponse
+            {
+                Id = x.Id,
+                AutoNumber = x.AutoNumber,
+                DeliveryDate = x.DeliveryDate,
+                SalesOrderNumber = x.SalesOrder!.AutoNumber,
+                Status = x.Status
+            }).ToListAsync(cancellationToken);
+    }
+}

Features/Sales/DeliveryOrder/Cqrs/GetDeliveryOrderLookupHandler.cs

@@ -0,0 +1,67 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+using Indotalent.Data.Enums;
+using Indotalent.ConfigBackEnd.Extensions;
+
+namespace Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+public class DeliveryOrderLookupResponse
+{
+    public List<LookupItem> SalesOrders { get; set; } = new();
+    public List<LookupItem> Warehouses { get; set; } = new();
+    public List<LookupItem> Products { get; set; } = new();
+    public List<LookupStatusItem> Statuses { get; set; } = new();
+}
+
+public class LookupItem
+{
+    public string? Id { get; set; }
+    public string? Name { get; set; }
+}
+
+public class LookupStatusItem
+{
+    public int Value { get; set; }
+    public string? Name { get; set; }
+}
+
+public record GetDeliveryOrderLookupQuery() : IRequest<DeliveryOrderLookupResponse>;
+
+public class GetDeliveryOrderLookupHandler : IRequestHandler<GetDeliveryOrderLookupQuery, DeliveryOrderLookupResponse>
+{
+    private readonly AppDbContext _context;
+    public GetDeliveryOrderLookupHandler(AppDbContext context) => _context = context;
+
+    public async Task<DeliveryOrderLookupResponse> Handle(GetDeliveryOrderLookupQuery request, CancellationToken cancellationToken)
+    {
+        var response = new DeliveryOrderLookupResponse();
+
+        response.SalesOrders = await _context.SalesOrder.AsNoTracking()
+            .Where(x => x.OrderStatus >= SalesOrderStatus.Confirmed)
+            .OrderByDescending(x => x.CreatedAt)
+            .Select(x => new LookupItem { Id = x.Id, Name = x.AutoNumber })
+            .ToListAsync(cancellationToken);
+
+        response.Warehouses = await _context.Warehouse.AsNoTracking()
+            .Where(x => x.SystemWarehouse == false)
+            .OrderBy(x => x.Name)
+            .Select(x => new LookupItem { Id = x.Id, Name = x.Name })
+            .ToListAsync(cancellationToken);
+
+        response.Products = await _context.Product.AsNoTracking()
+            .OrderBy(x => x.Name)
+            .Select(x => new LookupItem { Id = x.Id, Name = x.Name })
+            .ToListAsync(cancellationToken);
+
+        response.Statuses = Enum.GetValues(typeof(DeliveryOrderStatus))
+            .Cast<DeliveryOrderStatus>()
+            .Select(x => new LookupStatusItem
+            {
+                Value = (int)x,
+                Name = x.GetDescription()
+            }).ToList();
+
+        return response;
+    }
+}

Features/Sales/DeliveryOrder/Cqrs/UpdateDeliveryOrderHandler.cs

@@ -0,0 +1,55 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+public class UpdateDeliveryOrderRequest
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+    public DateTime? DeliveryDate { get; set; }
+    public Data.Enums.DeliveryOrderStatus Status { get; set; }
+    public string? Description { get; set; }
+    public string? SalesOrderId { get; set; }
+    public DateTimeOffset? CreatedAt { get; set; }
+    public string? CreatedBy { get; set; }
+    public DateTimeOffset? UpdatedAt { get; set; }
+    public string? UpdatedBy { get; set; }
+}
+
+public record UpdateDeliveryOrderCommand(UpdateDeliveryOrderRequest Data) : IRequest<bool>;
+
+public class UpdateDeliveryOrderHandler : IRequestHandler<UpdateDeliveryOrderCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public UpdateDeliveryOrderHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(UpdateDeliveryOrderCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.DeliveryOrder
+            .FirstOrDefaultAsync(x => x.Id == request.Data.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        entity.DeliveryDate = request.Data.DeliveryDate;
+        entity.Status = request.Data.Status;
+        entity.Description = request.Data.Description;
+        entity.SalesOrderId = request.Data.SalesOrderId;
+
+        var transactions = await _context.InventoryTransaction
+            .Where(x => x.ModuleId == entity.Id && x.ModuleName == nameof(Data.Entities.DeliveryOrder))
+            .ToListAsync(cancellationToken);
+
+        foreach (var trans in transactions)
+        {
+            trans.MovementDate = entity.DeliveryDate ?? DateTime.Now;
+            trans.ModuleNumber = entity.AutoNumber;
+            trans.Status = (Data.Enums.InventoryTransactionStatus)entity.Status;
+            _context.CalculateInvenTrans(trans);
+        }
+
+        await _context.SaveChangesAsync(cancellationToken);
+        return true;
+    }
+}

Features/Sales/DeliveryOrder/Cqrs/UpdateDeliveryOrderItemHandler.cs

@@ -0,0 +1,38 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+public class UpdateDeliveryOrderItemRequest
+{
+    public string? Id { get; set; }
+    public string? WarehouseId { get; set; }
+    public string? ProductId { get; set; }
+    public double? Movement { get; set; }
+}
+
+public record UpdateDeliveryOrderItemCommand(UpdateDeliveryOrderItemRequest Data) : IRequest<bool>;
+
+public class UpdateDeliveryOrderItemHandler : IRequestHandler<UpdateDeliveryOrderItemCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public UpdateDeliveryOrderItemHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(UpdateDeliveryOrderItemCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.InventoryTransaction
+            .FirstOrDefaultAsync(x => x.Id == request.Data.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        entity.WarehouseId = request.Data.WarehouseId;
+        entity.ProductId = request.Data.ProductId;
+        entity.Movement = request.Data.Movement;
+
+        _context.CalculateInvenTrans(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+
+        return true;
+    }
+}

Features/Sales/DeliveryOrder/Cqrs/UpdateDeliveryOrderValidator.cs

@@ -0,0 +1,12 @@
+using FluentValidation;
+
+namespace Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+public class UpdateDeliveryOrderValidator : AbstractValidator<UpdateDeliveryOrderRequest>
+{
+    public UpdateDeliveryOrderValidator()
+    {
+        RuleFor(x => x.Id).NotEmpty();
+        RuleFor(x => x.SalesOrderId).NotEmpty();
+    }
+}

Features/Sales/DeliveryOrder/DeliveryOrderEndpoint.cs

@@ -0,0 +1,97 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+using MediatR;
+using Microsoft.AspNetCore.Authentication.JwtBearer;
+
+namespace Indotalent.Features.Sales.DeliveryOrder;
+
+public static class DeliveryOrderEndpoint
+{
+    public static void MapDeliveryOrderEndpoints(this IEndpointRouteBuilder app)
+    {
+        var group = app.MapGroup("/delivery-order").WithTags("DeliveryOrders")
+            .RequireAuthorization(policy => policy.AddAuthenticationSchemes(JwtBearerDefaults.AuthenticationScheme)
+            .RequireAuthenticatedUser());
+
+        group.MapGet("/", async (IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetDeliveryOrderListQuery());
+            return result.ToApiResponse("Delivery order list retrieved successfully");
+        })
+        .WithName("GetDeliveryOrderList");
+
+        group.MapGet("/{id}", async (string id, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetDeliveryOrderByIdQuery(id));
+            return result.ToApiResponse(result is not null
+                ? "Delivery order detail retrieved successfully"
+                : $"Delivery order with ID {id} not found");
+        })
+        .WithName("GetDeliveryOrderById");
+
+        group.MapGet("/lookup", async (IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetDeliveryOrderLookupQuery());
+            return result.ToApiResponse("Lookup data retrieved successfully");
+        })
+        .WithName("GetDeliveryOrderLookup");
+
+        group.MapPost("/", async (CreateDeliveryOrderRequest request, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new CreateDeliveryOrderCommand(request));
+            return result.ToApiResponse("Delivery order has been created successfully", StatusCodes.Status201Created);
+        })
+        .WithName("CreateDeliveryOrder");
+
+        group.MapPost("/update", async (UpdateDeliveryOrderRequest request, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new UpdateDeliveryOrderCommand(request));
+            if (!result)
+            {
+                return ((object?)null).ToApiResponse("Update failed. Delivery order not found.");
+            }
+            return result.ToApiResponse("Delivery order has been updated successfully");
+        })
+        .WithName("UpdateDeliveryOrder");
+
+        group.MapPost("/delete/{id}", async (string id, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new DeleteDeliveryOrderByIdCommand(id));
+            if (!result)
+            {
+                return ((object?)null).ToApiResponse("Delete failed. Delivery order not found.");
+            }
+            return true.ToApiResponse("Delivery order has been deleted successfully");
+        })
+        .WithName("DeleteDeliveryOrderById");
+
+        group.MapPost("/delivery-order-item", async (CreateDeliveryOrderItemRequest request, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new CreateDeliveryOrderItemCommand(request));
+            return result.ToApiResponse("Item has been added successfully");
+        })
+        .WithName("CreateDeliveryOrderItem");
+
+        group.MapPost("/delivery-order-item/update", async (UpdateDeliveryOrderItemRequest request, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new UpdateDeliveryOrderItemCommand(request));
+            if (!result)
+            {
+                return ((object?)null).ToApiResponse("Update item failed.");
+            }
+            return result.ToApiResponse("Item has been updated successfully");
+        })
+        .WithName("UpdateDeliveryOrderItem");
+
+        group.MapPost("/delivery-order-item/delete/{id}", async (string id, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new DeleteDeliveryOrderItemCommand(id));
+            if (!result)
+            {
+                return ((object?)null).ToApiResponse("Delete item failed.");
+            }
+            return true.ToApiResponse("Item has been removed successfully");
+        })
+        .WithName("DeleteDeliveryOrderItem");
+    }
+}

Features/Sales/DeliveryOrder/DeliveryOrderPdfGenerator.cs

@@ -0,0 +1,110 @@
+using QuestPDF.Fluent;
+using QuestPDF.Helpers;
+using QuestPDF.Infrastructure;
+using Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+
+namespace Indotalent.Features.Sales.DeliveryOrder;
+
+public class DeliveryOrderPdfGenerator
+{
+    public static byte[] Generate(GetDeliveryOrderByIdResponse data)
+    {
+        QuestPDF.Settings.License = LicenseType.Community;
+
+        var primaryBlue = "#0D47A1";
+        var textSlate = "#64748b";
+
+        return Document.Create(container =>
+        {
+            container.Page(page =>
+            {
+                page.Size(PageSizes.A4);
+                page.Margin(1.5f, Unit.Centimetre);
+                page.PageColor(Colors.White);
+                page.DefaultTextStyle(x => x.FontSize(9).FontFamily(Fonts.Verdana));
+
+                page.Header().Row(row =>
+                {
+                    row.RelativeItem().Column(col =>
+                    {
+                        col.Item().Text("DELIVERY ORDER")
+                            .FontSize(20).ExtraBold().FontColor(primaryBlue);
+                        col.Item().Text($"{data.AutoNumber}").FontSize(11).SemiBold();
+                    });
+
+                    row.RelativeItem().AlignRight().Column(col =>
+                    {
+                        col.Item().Text("SHIPPING SLIP").FontSize(11).ExtraBold();
+                        col.Item().Text($"SO Reference: {data.SalesOrderNumber}").FontColor(textSlate);
+                        col.Item().Text($"Date: {data.DeliveryDate?.ToString("dd MMM yyyy")}").FontColor(textSlate);
+                    });
+                });
+
+                page.Content().PaddingVertical(20).Column(col =>
+                {
+                    col.Item().PaddingTop(10).Table(table =>
+                    {
+                        table.ColumnsDefinition(columns =>
+                        {
+                            columns.ConstantColumn(30);
+                            columns.RelativeColumn(4);
+                            columns.RelativeColumn(3);
+                            columns.RelativeColumn(2);
+                        });
+
+                        table.Header(header =>
+                        {
+                            header.Cell().Element(HeaderStyle).Text("#");
+                            header.Cell().Element(HeaderStyle).Text("Product Name");
+                            header.Cell().Element(HeaderStyle).Text("Warehouse");
+                            header.Cell().Element(HeaderStyle).AlignCenter().Text("Qty");
+
+                            static IContainer HeaderStyle(IContainer container)
+                            {
+                                return container.DefaultTextStyle(x => x.SemiBold().FontColor(Colors.White))
+                                                .PaddingVertical(5).PaddingHorizontal(5).Background("#0D47A1");
+                            }
+                        });
+
+                        var index = 1;
+                        foreach (var item in data.Items)
+                        {
+                            table.Cell().Element(CellStyle).Text($"{index++}");
+                            table.Cell().Element(CellStyle).Text(item.ProductName);
+                            table.Cell().Element(CellStyle).Text(item.WarehouseName);
+                            table.Cell().Element(CellStyle).AlignCenter().Text(item.Movement?.ToString());
+
+                            static IContainer CellStyle(IContainer container)
+                            {
+                                return container.BorderBottom(1).BorderColor("#E2E8F0").PaddingVertical(8).PaddingHorizontal(5);
+                            }
+                        }
+                    });
+
+                    col.Item().PaddingTop(20).Row(row =>
+                    {
+                        row.RelativeItem().Column(c => {
+                            c.Item().Text("Notes:").FontSize(8).Bold();
+                            c.Item().Text(string.IsNullOrEmpty(data.Description) ? "-" : data.Description).FontSize(8);
+                            c.Item().PaddingTop(10).Text($"Status: {data.Status.ToString().ToUpper()}").FontSize(9).Bold().FontColor(primaryBlue);
+                        });
+
+                        row.ConstantItem(150).Column(c => {
+                            c.Item().PaddingTop(10).AlignCenter().Text("Issued By,").FontSize(8);
+                            c.Item().PaddingTop(40).AlignCenter().Text("____________________").FontSize(8);
+                            c.Item().AlignCenter().Text("( Customer / Consignee )").FontSize(7);
+                        });
+                    });
+                });
+
+                page.Footer().AlignCenter().Text(x =>
+                {
+                    x.Span("Page ").FontSize(8);
+                    x.CurrentPageNumber().FontSize(8);
+                    x.Span(" of ").FontSize(8);
+                    x.TotalPages().FontSize(8);
+                });
+            });
+        }).GeneratePdf();
+    }
+}

Features/Sales/DeliveryOrder/DeliveryOrderService.cs

@@ -0,0 +1,86 @@
+using Indotalent.ConfigBackEnd.Interfaces;
+using Indotalent.ConfigFrontEnd.Common;
+using Indotalent.Features.Sales.DeliveryOrder.Cqrs;
+using Indotalent.Infrastructure.Authentication.Identity;
+using Indotalent.Shared.Models;
+using Microsoft.AspNetCore.Components;
+using MudBlazor;
+using RestSharp;
+
+namespace Indotalent.Features.Sales.DeliveryOrder;
+
+public class DeliveryOrderService : BaseService
+{
+    private readonly RestClient _client;
+
+    public DeliveryOrderService(
+            IHttpClientFactory clientFactory,
+            NavigationManager nav,
+            ISnackbar snackbar,
+            ICurrentUserService currentUserService,
+            TokenProvider tokenProvider)
+            : base(clientFactory, nav, snackbar, currentUserService, tokenProvider)
+    {
+        _client = new RestClient(nav.BaseUri);
+    }
+
+    public async Task<ApiResponse<List<GetDeliveryOrderListResponse>>?> GetDeliveryOrderListAsync()
+    {
+        var request = new RestRequest("api/delivery-order", Method.Get);
+        return await ExecuteWithResponseAsync<List<GetDeliveryOrderListResponse>>(_client, request);
+    }
+
+    public async Task<ApiResponse<GetDeliveryOrderByIdResponse>?> GetDeliveryOrderByIdAsync(string id)
+    {
+        var request = new RestRequest($"api/delivery-order/{id}", Method.Get);
+        return await ExecuteWithResponseAsync<GetDeliveryOrderByIdResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<DeliveryOrderLookupResponse>?> GetDeliveryOrderLookupAsync()
+    {
+        var request = new RestRequest("api/delivery-order/lookup", Method.Get);
+        return await ExecuteWithResponseAsync<DeliveryOrderLookupResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<CreateDeliveryOrderResponse>?> CreateDeliveryOrderAsync(CreateDeliveryOrderRequest data)
+    {
+        var request = new RestRequest("api/delivery-order", Method.Post);
+        request.AddJsonBody(data);
+        return await ExecuteWithResponseAsync<CreateDeliveryOrderResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<bool>?> UpdateDeliveryOrderAsync(UpdateDeliveryOrderRequest data)
+    {
+        var request = new RestRequest("api/delivery-order/update", Method.Post);
+        request.AddJsonBody(data);
+        return await ExecuteWithResponseAsync<bool>(_client, request);
+    }
+
+    public async Task<bool> DeleteDeliveryOrderByIdAsync(string id)
+    {
+        var request = new RestRequest($"api/delivery-order/delete/{id}", Method.Post);
+        var response = await ExecuteWithResponseAsync<object>(_client, request);
+        return response?.IsSuccess ?? false;
+    }
+
+    public async Task<ApiResponse<bool>?> CreateDeliveryOrderItemAsync(CreateDeliveryOrderItemRequest data)
+    {
+        var request = new RestRequest("api/delivery-order/delivery-order-item", Method.Post);
+        request.AddJsonBody(data);
+        return await ExecuteWithResponseAsync<bool>(_client, request);
+    }
+
+    public async Task<ApiResponse<bool>?> UpdateDeliveryOrderItemAsync(UpdateDeliveryOrderItemRequest data)
+    {
+        var request = new RestRequest("api/delivery-order/delivery-order-item/update", Method.Post);
+        request.AddJsonBody(data);
+        return await ExecuteWithResponseAsync<bool>(_client, request);
+    }
+
+    public async Task<bool> DeleteDeliveryOrderItemAsync(string id)
+    {
+        var request = new RestRequest($"api/delivery-order/delivery-order-item/delete/{id}", Method.Post);
+        var response = await ExecuteWithResponseAsync<object>(_client, request);
+        return response?.IsSuccess ?? false;
+    }
+}

Features/Sales/DeliveryReport/Components/DeliveryReportPage.razor

@@ -0,0 +1,8 @@
+@page "/sales/delivery-report"
+@using Indotalent.Features.Sales.DeliveryReport.Components
+@using MudBlazor
+
+<_DeliveryReportDataTable />
+
+@code {
+}

Features/Sales/DeliveryReport/Components/_DeliveryReportDataTable.razor

@@ -0,0 +1,304 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.DeliveryReport
+@using Indotalent.Features.Sales.DeliveryReport.Cqrs
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using MudBlazor
+@using Features.Root.Shared
+@using ClosedXML.Excel
+@using System.IO
+@inject DeliveryReportService DeliveryReportService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #E5E7EB; border-radius: 12px;">
+    <div>
+        <MudText Typo="Typo.h5" Style="font-weight: 600; color: #111827;">Delivery Report</MudText>
+        <MudText Typo="Typo.body2" Style="color: #9CA3AF;">Tracking stock movements for delivery orders and sales fulfillment.</MudText>
+    </div>
+    <div class="d-flex align-center gap-2">
+        <MudIcon Icon="@Icons.Material.Filled.Home" Size="Size.Small" Color="Color.Default" />
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">Sales</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="font-weight: 600; color: #111827;">Delivery Report</MudText>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; overflow: hidden; background-color: #ffffff; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff; min-height: 80px;">
+        <div style="display: flex; align-items: center; gap: 8px;">
+            <MudTextField @bind-Value="_searchString"
+                          Placeholder="Search Order, Customer or Product..."
+                          Adornment="Adornment.Start"
+                          AdornmentIcon="@Icons.Material.Filled.Search"
+                          IconSize="Size.Small"
+                          Class="mt-0"
+                          Variant="Variant.Outlined"
+                          Margin="Margin.Dense"
+                          Style="background-color: white; width: 280px; border-radius: 8px;"
+                          OnKeyDown="@HandleSearchKeyDown" />
+            <MudButton Variant="Variant.Filled"
+                       Color="Color.Primary"
+                       OnClick="OnSearchClick"
+                       Size="Size.Small"
+                       Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px; box-shadow: none;">
+                Search
+            </MudButton>
+        </div>
+
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Success"
+                       OnClick="ExportToExcel"
+                       Size="Size.Small"
+                       Disabled="_isExporting"
+                       StartIcon="@(_isExporting ? null : Icons.Custom.FileFormats.FileExcel)"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isExporting)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Excel</MudText>
+                }
+            </MudButton>
+
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Primary"
+                       OnClick="LoadData"
+                       Size="Size.Small"
+                       StartIcon="@(_isRefreshing ? null : Icons.Material.Filled.Refresh)"
+                       Disabled="_isRefreshing"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isRefreshing)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Refreshing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Refresh</MudText>
+                }
+            </MudButton>
+        </div>
+    </div>
+
+    <MudTable Items="@GetPagedData()" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" CustomHeader="true" Dense="true" T="GetDeliveryReportListDto" Loading="@_isRefreshing">
+        <HeaderContent>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryReportListDto, object>(x => x.DeliveryOrderNumber!)">Delivery Order</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryReportListDto, object>(x => x.SalesOrderNumber!)">Sales Order</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryReportListDto, object>(x => x.CustomerName!)">Customer</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryReportListDto, object>(x => x.WarehouseName!)">Warehouse</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryReportListDto, object>(x => x.ProductNumber!)">Product Number</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryReportListDto, object>(x => x.ProductName!)">Product Name</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryReportListDto, object>(x => x.Quantity!)">Qty</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetDeliveryReportListDto, object>(x => x.DeliveryDate!)">Delivery Date</MudTableSortLabel>
+            </MudTh>
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.DeliveryOrderNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.SalesOrderNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.CustomerName</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.WarehouseName</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.ProductNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.ProductName</MudTd>
+            <MudTd Style="text-align: right; font-weight: 700;">@context.Quantity?.ToString("N2")</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.DeliveryDate?.ToString("yyyy-MM-dd")</MudTd>
+        </RowTemplate>
+    </MudTable>
+
+    <div style="display: flex; justify-content: space-between; align-items: center; padding: 12px 24px; background-color: #F9FAFB; border-top: 1px solid #E5E7EB;">
+        <div style="display: flex; align-items: center; gap: 12px;">
+            <MudText Typo="Typo.caption" Style="font-weight: 500; color: #9CA3AF; font-size: 0.75rem;">Rows per page:</MudText>
+            <MudSelect T="int" Value="@_top" ValueChanged="OnPageSizeChanged" Dense="true" Margin="Margin.Dense" Style="width: 80px; background-color: white; font-size: 12px; font-weight: 600;" Variant="Variant.Outlined" Class="mt-0 custom-select-dense">
+                <MudSelectItem Value="5" />
+                <MudSelectItem Value="10" />
+                <MudSelectItem Value="50" />
+                <MudSelectItem Value="500" />
+                <MudSelectItem Value="1000" />
+            </MudSelect>
+            <MudText Typo="Typo.caption" Style="color: #9CA3AF; margin-left: 12px; font-size: 0.75rem; font-weight: 500;">
+                Showing @(GetFilteredData().Count() == 0 ? 0 : _skip + 1)-@Math.Min(_skip + _top, GetFilteredData().Count()) of @GetFilteredData().Count()
+            </MudText>
+        </div>
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudIconButton Icon="@Icons.Material.Filled.FirstPage" Size="Size.Small" OnClick="@(() => OnPageChanged(1))" Disabled="@(_currentPage == 1)" Style="@(_currentPage == 1 ? "color: #D1D5DB; background: transparent;" : "color: #6B7280; background: white; border: 1px solid #D1D5DB; border-radius: 6px;")" />
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage - 1))" Disabled="@(_currentPage == 1)" Variant="Variant.Text" StartIcon="@Icons.Material.Filled.ChevronLeft" Size="Size.Small" Style="@(_currentPage == 1 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Prev</MudButton>
+            @{
+                var totalPages = _totalPage == 0 ? 1 : _totalPage;
+                var maxVisible = 5;
+                var startPage = Math.Max(1, _currentPage - maxVisible / 2);
+                var endPage = Math.Min(totalPages, startPage + maxVisible - 1);
+                if (endPage - startPage < maxVisible - 1) { startPage = Math.Max(1, endPage - maxVisible + 1); }
+            }
+            @for (int i = startPage; i <= endPage; i++)
+            {
+                var pageNum = i;
+                var isActive = pageNum == _currentPage;
+                <MudButton OnClick="@(() => OnPageChanged(pageNum))"
+                           Variant="Variant.Text" Size="Size.Small"
+                           Style="@(isActive ? "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 600; background: #3B82F6; color: white; border: 1px solid #3B82F6; border-radius: 6px; text-transform: none;" : "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 500; color: #374151; background: white; border: 1px solid #D1D5DB; border-radius: 6px; text-transform: none;")">@pageNum</MudButton>
+            }
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage + 1))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Variant="Variant.Text" EndIcon="@Icons.Material.Filled.ChevronRight" Size="Size.Small" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Next</MudButton>
+            <MudIconButton Icon="@Icons.Material.Filled.LastPage" Size="Size.Small" OnClick="@(() => OnPageChanged(_totalPage))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "color: #D1D5DB; background: transparent;" : "background-color: white; border: 1px solid #D1D5DB; color: #6B7280;")" />
+        </div>
+    </div>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    private List<GetDeliveryReportListDto> _items = new();
+    private string _searchString = "";
+    private bool _isRefreshing = false;
+    private bool _isExporting = false;
+
+    private int _skip = 0;
+    private int _top = 50;
+    private int _totalPage => GetFilteredData().Count() == 0 ? 0 : (int)Math.Ceiling((double)GetFilteredData().Count() / (_top == 0 ? 1 : _top));
+    private int _currentPage => (_top >= GetFilteredData().Count() || _top == 0) ? 1 : (_skip / _top) + 1;
+
+    protected override async Task OnInitializedAsync() => await LoadData();
+
+    private async Task LoadData()
+    {
+        _isRefreshing = true;
+        StateHasChanged();
+        try
+        {
+            var response = await DeliveryReportService.GetDeliveryReportListAsync();
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                _items = response.Value ?? new();
+            }
+        }
+        finally
+        {
+            _isRefreshing = false;
+            StateHasChanged();
+        }
+    }
+
+    private IEnumerable<GetDeliveryReportListDto> GetFilteredData()
+    {
+        if (string.IsNullOrWhiteSpace(_searchString)) return _items;
+        return _items.Where(x =>
+            (x.DeliveryOrderNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.CustomerName?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.ProductName?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.SalesOrderNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false)
+        );
+    }
+
+    private IEnumerable<GetDeliveryReportListDto> GetPagedData() => GetFilteredData().Skip(_skip).Take(_top);
+
+    private void OnSearchClick()
+    {
+        _skip = 0;
+        StateHasChanged();
+    }
+
+    private void HandleSearchKeyDown(KeyboardEventArgs e)
+    {
+        if (e.Key == "Enter") OnSearchClick();
+    }
+
+    private async Task ExportToExcel()
+    {
+        _isExporting = true;
+        StateHasChanged();
+        try
+        {
+            await Task.Delay(1000);
+            using (var workbook = new XLWorkbook())
+            {
+                var worksheet = workbook.Worksheets.Add("DeliveryReports");
+                var currentRow = 1;
+
+                string[] headers = { "Delivery Order", "Sales Order", "Customer", "Warehouse", "Product Number", "Product Name", "Quantity", "Delivery Date" };
+                for (int i = 0; i < headers.Length; i++)
+                {
+                    worksheet.Cell(currentRow, i + 1).Value = headers[i];
+                }
+
+                var headerRange = worksheet.Range(1, 1, 1, headers.Length);
+                headerRange.Style.Font.Bold = true;
+                headerRange.Style.Fill.BackgroundColor = XLColor.FromHtml("#0D47A1");
+                headerRange.Style.Font.FontColor = XLColor.White;
+
+                foreach (var item in GetFilteredData())
+                {
+                    currentRow++;
+                    worksheet.Cell(currentRow, 1).Value = item.DeliveryOrderNumber;
+                    worksheet.Cell(currentRow, 2).Value = item.SalesOrderNumber;
+                    worksheet.Cell(currentRow, 3).Value = item.CustomerName;
+                    worksheet.Cell(currentRow, 4).Value = item.WarehouseName;
+                    worksheet.Cell(currentRow, 5).Value = item.ProductNumber;
+                    worksheet.Cell(currentRow, 6).Value = item.ProductName;
+                    worksheet.Cell(currentRow, 7).Value = item.Quantity;
+                    worksheet.Cell(currentRow, 8).Value = item.DeliveryDate?.ToString("yyyy-MM-dd");
+                }
+
+                worksheet.Columns().AdjustToContents();
+
+                using (var stream = new MemoryStream())
+                {
+                    workbook.SaveAs(stream);
+                    var content = Convert.ToBase64String(stream.ToArray());
+                    await JSRuntime.InvokeVoidAsync("downloadFile", "Delivery_Report.xlsx", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", content);
+                    Snackbar.Add("Excel exported successfully", Severity.Success);
+                }
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Export failed: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _isExporting = false;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageChanged(int page)
+    {
+        if (page >= 1 && page <= _totalPage)
+        {
+            _skip = (page - 1) * _top;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageSizeChanged(int size)
+    {
+        _top = size;
+        _skip = 0;
+        StateHasChanged();
+    }
+}

Features/Sales/DeliveryReport/Cqrs/GetDeliveryReportListHandler.cs

@@ -0,0 +1,65 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.DeliveryReport.Cqrs;
+
+public record GetDeliveryReportListDto
+{
+    public string? Id { get; init; }
+    public string? DeliveryOrderNumber { get; init; }
+    public string? SalesOrderNumber { get; init; }
+    public string? CustomerName { get; init; }
+    public string? WarehouseName { get; init; }
+    public string? ProductNumber { get; init; }
+    public string? ProductName { get; init; }
+    public double? Quantity { get; init; }
+    public DateTime? DeliveryDate { get; init; }
+}
+
+public record GetDeliveryReportListQuery() : IRequest<List<GetDeliveryReportListDto>>;
+
+public class GetDeliveryReportListHandler : IRequestHandler<GetDeliveryReportListQuery, List<GetDeliveryReportListDto>>
+{
+    private readonly AppDbContext _context;
+
+    public GetDeliveryReportListHandler(AppDbContext context)
+    {
+        _context = context;
+    }
+
+    public async Task<List<GetDeliveryReportListDto>> Handle(GetDeliveryReportListQuery request, CancellationToken cancellationToken)
+    {
+        var query = _context.InventoryTransaction
+            .AsNoTracking()
+            .Include(x => x.Product)
+            .Include(x => x.Warehouse)
+            .Where(x => x.ModuleName == "DeliveryOrder")
+            .GroupJoin(
+                _context.DeliveryOrder.AsNoTracking()
+                    .Include(x => x.SalesOrder)
+                    .ThenInclude(x => x!.Customer),
+                inventory => inventory.ModuleId,
+                delivery => delivery.Id,
+                (inventory, deliveries) => new { inventory, deliveries }
+            )
+            .SelectMany(
+                x => x.deliveries.DefaultIfEmpty(),
+                (x, delivery) => new GetDeliveryReportListDto
+                {
+                    Id = x.inventory.Id,
+                    DeliveryOrderNumber = delivery != null ? delivery.AutoNumber : x.inventory.ModuleNumber,
+                    SalesOrderNumber = (delivery != null && delivery.SalesOrder != null) ? delivery.SalesOrder.AutoNumber : string.Empty,
+                    CustomerName = (delivery != null && delivery.SalesOrder != null && delivery.SalesOrder.Customer != null) ? delivery.SalesOrder.Customer.Name : string.Empty,
+                    WarehouseName = x.inventory.Warehouse != null ? x.inventory.Warehouse.Name : string.Empty,
+                    ProductNumber = x.inventory.Product != null ? x.inventory.Product.AutoNumber : string.Empty,
+                    ProductName = x.inventory.Product != null ? x.inventory.Product.Name : string.Empty,
+                    Quantity = x.inventory.Movement,
+                    DeliveryDate = delivery != null ? delivery.DeliveryDate : x.inventory.MovementDate
+                }
+            )
+            .OrderByDescending(x => x.DeliveryDate);
+
+        return await query.ToListAsync(cancellationToken);
+    }
+}

Features/Sales/DeliveryReport/DeliveryReportEndpoint.cs

@@ -0,0 +1,23 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Features.Sales.DeliveryReport.Cqrs;
+using MediatR;
+using Microsoft.AspNetCore.Authentication.JwtBearer;
+
+namespace Indotalent.Features.Sales.DeliveryReport;
+
+public static class DeliveryReportEndpoint
+{
+    public static void MapDeliveryReportEndpoints(this IEndpointRouteBuilder app)
+    {
+        var group = app.MapGroup("/delivery-report").WithTags("DeliveryReports")
+            .RequireAuthorization(policy => policy.AddAuthenticationSchemes(JwtBearerDefaults.AuthenticationScheme)
+            .RequireAuthenticatedUser());
+
+        group.MapGet("/", async (IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetDeliveryReportListQuery());
+            return result.ToApiResponse("Delivery report list retrieved successfully");
+        })
+        .WithName("GetDeliveryReportList");
+    }
+}

Features/Sales/DeliveryReport/DeliveryReportService.cs

@@ -0,0 +1,32 @@
+using Indotalent.ConfigBackEnd.Interfaces;
+using Indotalent.ConfigFrontEnd.Common;
+using Indotalent.Features.Sales.DeliveryReport.Cqrs;
+using Indotalent.Infrastructure.Authentication.Identity;
+using Indotalent.Shared.Models;
+using Microsoft.AspNetCore.Components;
+using MudBlazor;
+using RestSharp;
+
+namespace Indotalent.Features.Sales.DeliveryReport;
+
+public class DeliveryReportService : BaseService
+{
+    private readonly RestClient _client;
+
+    public DeliveryReportService(
+            IHttpClientFactory clientFactory,
+            NavigationManager nav,
+            ISnackbar snackbar,
+            ICurrentUserService currentUserService,
+            TokenProvider tokenProvider)
+            : base(clientFactory, nav, snackbar, currentUserService, tokenProvider)
+    {
+        _client = new RestClient(nav.BaseUri);
+    }
+
+    public async Task<ApiResponse<List<GetDeliveryReportListDto>>?> GetDeliveryReportListAsync()
+    {
+        var request = new RestRequest("api/delivery-report", Method.Get);
+        return await ExecuteWithResponseAsync<List<GetDeliveryReportListDto>>(_client, request);
+    }
+}

Features/Sales/Invoice/Components/InvoicePage.razor

@@ -0,0 +1,51 @@
+@page "/sales/invoice"
+@using Indotalent.Features.Sales.Invoice.Cqrs
+@using Indotalent.Features.Sales.Invoice.Components
+@using MudBlazor
+
+@if (_currentView == ViewMode.Create)
+{
+    <_InvoiceCreateForm OnCancel="BackToTable" OnSuccess="HandleSuccess" />
+}
+else if (_currentView == ViewMode.Update || _currentView == ViewMode.View)
+{
+    <_InvoiceUpdateForm Data="_selectedData!"
+                        ReadOnly="@(_currentView == ViewMode.View)"
+                        OnCancel="BackToTable"
+                        OnSuccess="HandleSuccess" />
+}
+else
+{
+    <_InvoiceDataTable OnAdd="() => ShowCreate()"
+                       OnEdit="(item) => ShowUpdate(item, false)"
+                       OnView="(item) => ShowUpdate(item, true)" />
+}
+
+@code {
+    private enum ViewMode { Table, Create, Update, View }
+    private ViewMode _currentView = ViewMode.Table;
+    private UpdateInvoiceRequest? _selectedData;
+
+    private void ShowCreate()
+    {
+        _currentView = ViewMode.Create;
+    }
+
+    private void ShowUpdate(UpdateInvoiceRequest data, bool isReadOnly)
+    {
+        _selectedData = data;
+        _currentView = isReadOnly ? ViewMode.View : ViewMode.Update;
+    }
+
+    private void BackToTable()
+    {
+        _currentView = ViewMode.Table;
+        _selectedData = null;
+    }
+
+    private void HandleSuccess()
+    {
+        _currentView = ViewMode.Table;
+        _selectedData = null;
+    }
+}

Features/Sales/Invoice/Components/_InvoiceCreateForm.razor

@@ -0,0 +1,181 @@
+@using Indotalent.Features.Sales.Invoice.Cqrs
+@using Indotalent.Shared.Utils
+@using MudBlazor
+@inject InvoiceService InvoiceService
+@inject ISnackbar Snackbar
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #DCEBFA;">
+    <div class="d-flex align-center gap-4">
+        <MudIconButton Icon="@Icons.Material.Filled.ArrowBack" OnClick="() => OnCancel.InvokeAsync()" />
+        <div>
+            <MudText Typo="Typo.h5" Style="font-weight: 900; color: #1a1a1a;">Add Invoice</MudText>
+            <MudText Typo="Typo.body2" Style="color: #64748b;">Create a new billing invoice from Sales Order.</MudText>
+        </div>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 4px; border: 1px solid #DCEBFA;">
+    <MudForm @ref="_form" Model="_model">
+        <MudGrid Spacing="3">
+            <MudItem xs="12"><MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Basic Information</MudText><MudDivider /></MudItem>
+            
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Invoice Date</MudText>
+                <MudDatePicker @bind-Date="_model.InvoiceDate"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Sales Order Reference</MudText>
+                <MudSelect T="string" Value="_model.SalesOrderId"
+                           ValueChanged="OnSalesOrderChanged"
+                           For="@(() => _model.SalesOrderId)"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.SalesOrders)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Status</MudText>
+                <MudSelect T="Indotalent.Data.Enums.InvoiceStatus" @bind-Value="_model.InvoiceStatus"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Statuses)
+                    {
+                        <MudSelectItem Value="@((Indotalent.Data.Enums.InvoiceStatus)item.Value)">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
+                <MudTextField @bind-Value="_model.Description"
+                              For="@(() => _model.Description)"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-6">
+                <_InvoiceSalesOrderItemDataTable Items="_items" ReadOnly="true" />
+            </MudItem>
+
+            <MudItem xs="12" sm="7"></MudItem>
+            <MudItem xs="12" sm="5">
+                <MudPaper Elevation="0" Outlined="true" Class="pa-4" Style="border-radius: 4px; background-color: #F8FAFC; border: 1px solid #DCEBFA;">
+                    <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;" Class="mb-4 d-block">Payment Summary</MudText>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Sub Total</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_beforeTax.ToString("N2")</MudText>
+                    </div>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Tax Amount</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_taxAmount.ToString("N2")</MudText>
+                    </div>
+                    <MudDivider Class="my-2" />
+                    <div class="d-flex justify-space-between">
+                        <MudText Typo="Typo.subtitle1" Style="font-weight: 900;">Total Amount</MudText>
+                        <MudText Typo="Typo.subtitle1" Color="Color.Primary" Style="font-weight: 900;">@_afterTax.ToString("N2")</MudText>
+                    </div>
+                </MudPaper>
+            </MudItem>
+        </MudGrid>
+
+        <div class="d-flex justify-end gap-2 mt-8">
+            <MudButton OnClick="() => OnCancel.InvokeAsync()"
+                       Variant="Variant.Outlined"
+                       Disabled="_processing"
+                       Style="border-radius: 4px; text-transform: none; font-weight: 700;border: 1px solid #e0e0e0;">
+                Cancel
+            </MudButton>
+            <MudButton Color="Color.Primary"
+                       Variant="Variant.Filled"
+                       OnClick="Submit"
+                       Disabled="_processing"
+                       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" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText>Create Invoice</MudText>
+                }
+            </MudButton>
+        </div>
+    </MudForm>
+</MudPaper>
+
+@code {
+    [Parameter] public EventCallback OnCancel { get; set; }
+    [Parameter] public EventCallback OnSuccess { get; set; }
+
+    private MudForm _form = default!;
+    private CreateInvoiceRequest _model = new() { InvoiceDate = DateTime.Today, InvoiceStatus = Indotalent.Data.Enums.InvoiceStatus.Draft };
+    private InvoiceLookupResponse _lookup = new();
+    private List<InvoiceSalesOrderItemResponse> _items = new();
+    private decimal _beforeTax = 0;
+    private decimal _taxAmount = 0;
+    private decimal _afterTax = 0;
+    private bool _processing = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var res = await InvoiceService.GetInvoiceLookupAsync();
+        if (res != null && res.IsSuccess) _lookup = res.Value ?? new();
+    }
+
+    private async Task OnSalesOrderChanged(string soId)
+    {
+        _model.SalesOrderId = soId;
+        if (string.IsNullOrEmpty(soId))
+        {
+            _items.Clear();
+            _beforeTax = 0;
+            _taxAmount = 0;
+            _afterTax = 0;
+            return;
+        }
+
+        var res = await InvoiceService.GetSalesOrderDetailForInvoiceAsync(soId);
+        await Task.Delay(500);
+        if (res != null && res.IsSuccess && res.Value != null)
+        {
+            _items = res.Value.Items;
+            _beforeTax = res.Value.BeforeTaxAmount ?? 0;
+            _taxAmount = res.Value.TaxAmount ?? 0;
+            _afterTax = res.Value.AfterTaxAmount ?? 0;
+            Snackbar.Add("Sales Order reference selected. Payment summary and items have been loaded.", Severity.Info);
+        }
+    }
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+
+        _processing = true;
+        try
+        {
+            var response = await InvoiceService.CreateInvoiceAsync(_model);
+            await Task.Delay(500);
+
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Created successfully", Severity.Success);
+                await OnSuccess.InvokeAsync();
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _processing = false;
+        }
+    }
+}

Features/Sales/Invoice/Components/_InvoiceDataTable.razor

@@ -0,0 +1,383 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.Invoice
+@using Indotalent.Features.Sales.Invoice.Cqrs
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using MudBlazor
+@using Features.Root.Shared
+@using ClosedXML.Excel
+@using System.IO
+@inject InvoiceService InvoiceService
+@inject IDialogService DialogService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #E5E7EB; border-radius: 12px;">
+    <div>
+        <MudText Typo="Typo.h5" Style="font-weight: 600; color: #111827;">Invoice</MudText>
+        <MudText Typo="Typo.body2" Style="color: #9CA3AF;">Manage customer billing based on Sales Orders.</MudText>
+    </div>
+    <div class="d-flex align-center gap-2">
+        <MudIcon Icon="@Icons.Material.Filled.Home" Size="Size.Small" Color="Color.Default" />
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">Sales</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="font-weight: 600; color: #111827;">Invoice</MudText>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; overflow: hidden; background-color: #ffffff; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff; min-height: 80px;">
+        <div style="display: flex; align-items: center; gap: 8px;">
+            <MudTextField @bind-Value="_searchString"
+                          Placeholder="Search..."
+                          Adornment="Adornment.Start"
+                          AdornmentIcon="@Icons.Material.Filled.Search"
+                          IconSize="Size.Small"
+                          Class="mt-0"
+                          Variant="Variant.Outlined"
+                          Margin="Margin.Dense"
+                          Style="background-color: white; width: 280px; border-radius: 8px;"
+                          OnKeyDown="@HandleSearchKeyDown" />
+            <MudButton Variant="Variant.Filled"
+                       Color="Color.Primary"
+                       OnClick="OnSearchClick"
+                       Size="Size.Small"
+                       Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px; box-shadow: none;">
+                Search
+            </MudButton>
+        </div>
+
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Success"
+                       OnClick="ExportToExcel"
+                       Size="Size.Small"
+                       Disabled="_isExporting"
+                       StartIcon="@(_isExporting ? null : Icons.Custom.FileFormats.FileExcel)"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isExporting)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Excel</MudText>
+                }
+            </MudButton>
+
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Primary"
+                       OnClick="LoadData"
+                       Size="Size.Small"
+                       StartIcon="@(_isRefreshing ? null : Icons.Material.Filled.Refresh)"
+                       Disabled="_isRefreshing"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isRefreshing)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Refreshing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Refresh</MudText>
+                }
+            </MudButton>
+
+            @if (_selectedItem != null)
+            {
+                <MudButton Variant="Variant.Outlined" Color="Color.Info" StartIcon="@Icons.Material.Filled.Visibility" OnClick="InvokeView" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background-color: white; border: 1px solid #D1D5DB; color: #6B7280;">View</MudButton>
+                <MudButton Variant="Variant.Outlined" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Edit" OnClick="InvokeEdit" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background-color: white; border: 1px solid #D1D5DB; color: #6B7280;">Edit</MudButton>
+                <MudButton Variant="Variant.Outlined" Color="Color.Error" StartIcon="@Icons.Material.Filled.Delete" OnClick="OnDelete" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background: white; border: 1px solid #FCA5A5; color: #EF4444;">Remove</MudButton>
+                <MudIconButton Icon="@Icons.Material.Filled.Close" Size="Size.Small" OnClick="() => _selectedItem = null" />
+            }
+            else
+            {
+                <MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add" OnClick="() => OnAdd.InvokeAsync()" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px;">
+                    Add Invoice
+                </MudButton>
+            }
+        </div>
+    </div>
+
+    <MudTable Items="@GetPagedData()" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" CustomHeader="true" Dense="true" T="GetInvoiceListResponse" OnRowClick="@((args) => _selectedItem = args.Item)" Loading="@_isRefreshing">
+        <HeaderContent>
+            <MudTh Style="width: 50px; background-color: #ffffff; border-bottom: 1px solid #E5E7EB;"></MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceListResponse, object>(x => x.AutoNumber!)">Invoice No</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceListResponse, object>(x => x.InvoiceDate!)">Date</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceListResponse, object>(x => x.SalesOrderAutoNumber!)">SO Ref</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceListResponse, object>(x => x.CustomerName!)">Customer</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceListResponse, object>(x => x.InvoiceStatus)">Status</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceListResponse, object>(x => x.AfterTaxAmount!)">Total Amount</MudTableSortLabel>
+            </MudTh>
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd>
+                <MudCheckBox T="bool" Value="@(_selectedItem?.Id == context.Id)" Color="Color.Primary" Dense="true" Size="Size.Small" ReadOnly="true" />
+            </MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.AutoNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.InvoiceDate?.ToString("yyyy-MM-dd")</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.SalesOrderAutoNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.CustomerName</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">
+                <MudChip T="string" Color="Color.Info" Size="Size.Small" Variant="Variant.Text" Style="font-weight: 600;">@context.InvoiceStatus.ToString().ToUpper()</MudChip>
+            </MudTd>
+            <MudTd Style="text-align: right; font-weight: 700;">@context.AfterTaxAmount?.ToString("N2")</MudTd>
+        </RowTemplate>
+    </MudTable>
+
+    <div style="display: flex; justify-content: space-between; align-items: center; padding: 12px 24px; background-color: #F9FAFB; border-top: 1px solid #E5E7EB;">
+        <div style="display: flex; align-items: center; gap: 12px;">
+            <MudText Typo="Typo.caption" Style="font-weight: 500; color: #9CA3AF; font-size: 0.75rem;">Rows per page:</MudText>
+            <MudSelect T="int" Value="@_top" ValueChanged="OnPageSizeChanged" Dense="true" Margin="Margin.Dense" Style="width: 80px; background-color: white; font-size: 12px; font-weight: 600;" Variant="Variant.Outlined" Class="mt-0">
+                <MudSelectItem Value="5" />
+                <MudSelectItem Value="10" />
+                <MudSelectItem Value="50" />
+                <MudSelectItem Value="500" />
+                <MudSelectItem Value="1000" />
+            </MudSelect>
+            <MudText Typo="Typo.caption" Style="color: #9CA3AF; margin-left: 12px; font-size: 0.75rem; font-weight: 500;">
+                Showing @(GetFilteredData().Count() == 0 ? 0 : _skip + 1)-@Math.Min(_skip + _top, GetFilteredData().Count()) of @GetFilteredData().Count()
+            </MudText>
+        </div>
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudIconButton Icon="@Icons.Material.Filled.FirstPage" Size="Size.Small" OnClick="@(() => OnPageChanged(1))" Disabled="@(_currentPage == 1)" Style="@(_currentPage == 1 ? "color: #D1D5DB; background: transparent;" : "color: #6B7280; background: white; border: 1px solid #D1D5DB; border-radius: 6px;")" />
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage - 1))" Disabled="@(_currentPage == 1)" Variant="Variant.Text" StartIcon="@Icons.Material.Filled.ChevronLeft" Size="Size.Small" Style="@(_currentPage == 1 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Prev</MudButton>
+            @{
+                var totalPages = _totalPage == 0 ? 1 : _totalPage;
+                var maxVisible = 5;
+                var startPage = Math.Max(1, _currentPage - maxVisible / 2);
+                var endPage = Math.Min(totalPages, startPage + maxVisible - 1);
+                if (endPage - startPage < maxVisible - 1) { startPage = Math.Max(1, endPage - maxVisible + 1); }
+            }
+            @for (int i = startPage; i <= endPage; i++)
+            {
+                var pageNum = i;
+                var isActive = pageNum == _currentPage;
+                <MudButton OnClick="@(() => OnPageChanged(pageNum))"
+                           Variant="Variant.Text" Size="Size.Small"
+                           Style="@(isActive ? "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 600; background: #3B82F6; color: white; border: 1px solid #3B82F6; border-radius: 6px; text-transform: none;" : "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 500; color: #374151; background: white; border: 1px solid #D1D5DB; border-radius: 6px; text-transform: none;")">@pageNum</MudButton>
+            }
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage + 1))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Variant="Variant.Text" EndIcon="@Icons.Material.Filled.ChevronRight" Size="Size.Small" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Next</MudButton>
+            <MudIconButton Icon="@Icons.Material.Filled.LastPage" Size="Size.Small" OnClick="@(() => OnPageChanged(_totalPage))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "color: #D1D5DB; background: transparent;" : "background-color: white; border: 1px solid #D1D5DB; color: #6B7280;")" />
+        </div>
+    </div>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    [Parameter] public EventCallback OnAdd { get; set; }
+    [Parameter] public EventCallback<UpdateInvoiceRequest> OnEdit { get; set; }
+    [Parameter] public EventCallback<UpdateInvoiceRequest> OnView { get; set; }
+
+    private List<GetInvoiceListResponse> _items = new();
+    private GetInvoiceListResponse? _selectedItem;
+    private string _searchString = "";
+    private bool _isRefreshing = false;
+    private bool _isExporting = false;
+
+    private int _skip = 0;
+    private int _top = 5;
+    private int _totalPage => GetFilteredData().Count() == 0 ? 0 : (int)Math.Ceiling((double)GetFilteredData().Count() / (_top == 0 ? 1 : _top));
+    private int _currentPage => (_top >= GetFilteredData().Count() || _top == 0) ? 1 : (_skip / _top) + 1;
+
+    protected override async Task OnInitializedAsync() => await LoadData();
+
+    private async Task LoadData()
+    {
+        _isRefreshing = true;
+        _selectedItem = null;
+        StateHasChanged();
+        try
+        {
+            var response = await InvoiceService.GetInvoiceListAsync();
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                _items = response.Value ?? new();
+            }
+        }
+        finally
+        {
+            _isRefreshing = false;
+            StateHasChanged();
+        }
+    }
+
+    private IEnumerable<GetInvoiceListResponse> GetFilteredData()
+    {
+        if (string.IsNullOrWhiteSpace(_searchString)) return _items;
+        return _items.Where(x =>
+            (x.AutoNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.SalesOrderAutoNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.CustomerName?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false)
+        );
+    }
+
+    private IEnumerable<GetInvoiceListResponse> GetPagedData() => GetFilteredData().Skip(_skip).Take(_top);
+
+    private void OnSearchClick()
+    {
+        _skip = 0;
+        _selectedItem = null;
+        StateHasChanged();
+    }
+
+    private void HandleSearchKeyDown(KeyboardEventArgs e)
+    {
+        if (e.Key == "Enter") OnSearchClick();
+    }
+
+    private async Task ExportToExcel()
+    {
+        _isExporting = true;
+        StateHasChanged();
+        try
+        {
+            await Task.Delay(1000);
+            using (var workbook = new XLWorkbook())
+            {
+                var worksheet = workbook.Worksheets.Add("Invoices");
+                var currentRow = 1;
+
+                worksheet.Cell(currentRow, 1).Value = "Invoice Number";
+                worksheet.Cell(currentRow, 2).Value = "Date";
+                worksheet.Cell(currentRow, 3).Value = "SO Reference";
+                worksheet.Cell(currentRow, 4).Value = "Customer";
+                worksheet.Cell(currentRow, 5).Value = "Status";
+                worksheet.Cell(currentRow, 6).Value = "Total Amount";
+
+                var headerRange = worksheet.Range(1, 1, 1, 6);
+                headerRange.Style.Font.Bold = true;
+                headerRange.Style.Fill.BackgroundColor = XLColor.FromHtml("#0D47A1");
+                headerRange.Style.Font.FontColor = XLColor.White;
+
+                foreach (var item in GetFilteredData())
+                {
+                    currentRow++;
+                    worksheet.Cell(currentRow, 1).Value = item.AutoNumber;
+                    worksheet.Cell(currentRow, 2).Value = item.InvoiceDate?.ToString("yyyy-MM-dd");
+                    worksheet.Cell(currentRow, 3).Value = item.SalesOrderAutoNumber;
+                    worksheet.Cell(currentRow, 4).Value = item.CustomerName;
+                    worksheet.Cell(currentRow, 5).Value = item.InvoiceStatus.ToString();
+                    worksheet.Cell(currentRow, 6).Value = item.AfterTaxAmount;
+                }
+
+                worksheet.Columns().AdjustToContents();
+
+                using (var stream = new MemoryStream())
+                {
+                    workbook.SaveAs(stream);
+                    var content = Convert.ToBase64String(stream.ToArray());
+                    await JSRuntime.InvokeVoidAsync("downloadFile", "Invoice_List.xlsx", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", content);
+                    Snackbar.Add("Excel exported successfully", Severity.Success);
+                }
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Export failed: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _isExporting = false;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageChanged(int page)
+    {
+        if (page >= 1 && page <= _totalPage)
+        {
+            _skip = (page - 1) * _top;
+            _selectedItem = null;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageSizeChanged(int size)
+    {
+        _top = size;
+        _skip = 0;
+        _selectedItem = null;
+        StateHasChanged();
+    }
+
+    private async Task InvokeEdit()
+    {
+        if (_selectedItem == null) return;
+        var request = await MapToUpdateRequest(_selectedItem.Id!);
+        if (request != null) await OnEdit.InvokeAsync(request);
+    }
+
+    private async Task InvokeView()
+    {
+        if (_selectedItem == null) return;
+        var request = await MapToUpdateRequest(_selectedItem.Id!);
+        if (request != null) await OnView.InvokeAsync(request);
+    }
+
+    private async Task<UpdateInvoiceRequest?> MapToUpdateRequest(string id)
+    {
+        var response = await InvoiceService.GetInvoiceByIdAsync(id);
+        if (response != null && response.IsSuccess && response.Value != null)
+        {
+            var detail = response.Value;
+            return new UpdateInvoiceRequest
+            {
+                Id = detail.Id,
+                InvoiceDate = detail.InvoiceDate,
+                InvoiceStatus = detail.InvoiceStatus,
+                AutoNumber = detail.AutoNumber,
+                Description = detail.Description,
+                SalesOrderId = detail.SalesOrderId,
+                CreatedAt = detail.CreatedAt,
+                CreatedBy = detail.CreatedBy,
+                UpdatedAt = detail.UpdatedAt,
+                UpdatedBy = detail.UpdatedBy
+            };
+        }
+        return null;
+    }
+
+    private async Task OnDelete()
+    {
+        if (_selectedItem == null) return;
+
+        var parameters = new DialogParameters<_DeleteConfirmation> { { x => x.ContentText, _selectedItem.AutoNumber } };
+        var options = new DialogOptions { CloseButton = false, MaxWidth = MaxWidth.ExtraSmall, FullWidth = true };
+
+        var dialog = await DialogService.ShowAsync<_DeleteConfirmation>("", parameters, options);
+        var result = await dialog.Result;
+
+        if (result != null && !result.Canceled)
+        {
+            var isSuccess = await InvoiceService.DeleteInvoiceByIdAsync(_selectedItem.Id!);
+            if (isSuccess)
+            {
+                _selectedItem = null;
+                await LoadData();
+                Snackbar.Add("Deleted successfully", Severity.Success);
+            }
+        }
+    }
+}

Features/Sales/Invoice/Components/_InvoiceSalesOrderItemDataTable.razor

@@ -0,0 +1,38 @@
+@using Indotalent.Features.Sales.Invoice.Cqrs
+@using MudBlazor
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; background-color: #ffffff;">
+        <MudText Typo="Typo.button" Color="Color.Default" Style="font-weight: 600; color: #111827;">Referenced Sales Order Items</MudText>
+    </div>
+
+    <MudTable Items="Items" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" Dense="true" T="InvoiceSalesOrderItemResponse">
+        <HeaderContent>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">Product</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">Summary</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Unit Price</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Quantity</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Total</MudTh>
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd DataLabel="Product">@context.ProductName</MudTd>
+            <MudTd DataLabel="Summary">@context.Summary</MudTd>
+            <MudTd DataLabel="UnitPrice" Style="text-align: right;">@context.UnitPrice?.ToString("N2")</MudTd>
+            <MudTd DataLabel="Quantity" Style="text-align: right;">@context.Quantity</MudTd>
+            <MudTd DataLabel="Total" Style="text-align: right; font-weight: 700;">@context.Total?.ToString("N2")</MudTd>
+        </RowTemplate>
+    </MudTable>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    [Parameter] public List<InvoiceSalesOrderItemResponse> Items { get; set; } = new();
+    [Parameter] public bool ReadOnly { get; set; } = true;
+}

Features/Sales/Invoice/Components/_InvoiceUpdateForm.razor

@@ -0,0 +1,265 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.Invoice.Cqrs
+@using Indotalent.Features.Sales.Invoice.Components
+@using Indotalent.Shared.Utils
+@using MudBlazor
+@using Microsoft.JSInterop
+@inject InvoiceService InvoiceService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #DCEBFA;">
+    <div class="d-flex align-center gap-4">
+        <MudIconButton Icon="@Icons.Material.Filled.ArrowBack" OnClick="() => OnCancel.InvokeAsync()" />
+        <div>
+            <MudText Typo="Typo.h5" Style="font-weight: 900; color: #1a1a1a;">@(ReadOnly ? "Details" : "Edit") Invoice</MudText>
+            <MudText Typo="Typo.body2" Style="color: #64748b;">@_model.AutoNumber</MudText>
+        </div>
+    </div>
+    @if (ReadOnly || !string.IsNullOrEmpty(_model.Id))
+    {
+        <MudButton Variant="Variant.Filled"
+                   Color="Color.Info"
+                   StartIcon="@(_isPrinting ? null : Icons.Material.Filled.Print)"
+                   OnClick="DownloadPdf"
+                   Disabled="_isPrinting"
+                   Style="border-radius: 4px; text-transform: none; font-weight: 700; box-shadow: none;">
+            @if (_isPrinting)
+            {
+                <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                <MudText Class="ms-2">Generating PDF...</MudText>
+            }
+            else
+            {
+                <MudText>Print PDF</MudText>
+            }
+        </MudButton>
+    }
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 4px; border: 1px solid #DCEBFA;">
+    <MudForm @ref="_form" Model="_model">
+        <MudGrid Spacing="3">
+            <MudItem xs="12"><MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Basic Information</MudText><MudDivider /></MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Invoice Date</MudText>
+                <MudDatePicker @bind-Date="_model.InvoiceDate" ReadOnly="ReadOnly"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Sales Order Reference</MudText>
+                <MudSelect T="string" Value="_model.SalesOrderId"
+                           ValueChanged="OnSalesOrderChanged"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.SalesOrders)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Status</MudText>
+                <MudSelect T="Indotalent.Data.Enums.InvoiceStatus" @bind-Value="_model.InvoiceStatus"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Statuses)
+                    {
+                        <MudSelectItem Value="@((Indotalent.Data.Enums.InvoiceStatus)item.Value)">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
+                <MudTextField @bind-Value="_model.Description"
+                              ReadOnly="ReadOnly"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-6">
+                <_InvoiceSalesOrderItemDataTable Items="_items" ReadOnly="true" />
+            </MudItem>
+
+            <MudItem xs="12" sm="7"></MudItem>
+            <MudItem xs="12" sm="5">
+                <MudPaper Elevation="0" Outlined="true" Class="pa-4" Style="border-radius: 4px; background-color: #F8FAFC; border: 1px solid #DCEBFA;">
+                    <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;" Class="mb-4 d-block">Payment Summary</MudText>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Sub Total</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_beforeTax.ToString("N2")</MudText>
+                    </div>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Tax Amount</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_taxAmount.ToString("N2")</MudText>
+                    </div>
+                    <MudDivider Class="my-2" />
+                    <div class="d-flex justify-space-between">
+                        <MudText Typo="Typo.subtitle1" Style="font-weight: 900;">Total Amount</MudText>
+                        <MudText Typo="Typo.subtitle1" Color="Color.Primary" Style="font-weight: 900;">@_afterTax.ToString("N2")</MudText>
+                    </div>
+                </MudPaper>
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-4">
+                <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Audit History</MudText>
+                <MudDivider Class="mt-2 mb-4" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Created At</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@DateTimeExtensions.ToString(_model.CreatedAt)</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Created By</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@(!string.IsNullOrEmpty(_model.CreatedBy) ? _model.CreatedBy : "System")</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Last Updated At</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@DateTimeExtensions.ToString(_model.UpdatedAt)</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Last Updated By</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@(!string.IsNullOrEmpty(_model.UpdatedBy) ? _model.UpdatedBy : "System")</MudText>
+            </MudItem>
+        </MudGrid>
+
+        <div class="d-flex justify-end gap-2 mt-10">
+            <MudButton OnClick="() => OnCancel.InvokeAsync()"
+                       Variant="Variant.Outlined"
+                       Disabled="_processing"
+                       Style="border-radius: 4px; text-transform: none; font-weight: 700;border: 1px solid #e0e0e0;">
+                @(ReadOnly ? "Back to List" : "Cancel")
+            </MudButton>
+            @if (!ReadOnly)
+            {
+                <MudButton Color="Color.Primary"
+                           Variant="Variant.Filled"
+                           OnClick="Submit"
+                           Disabled="_processing"
+                           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>Save Changes</MudText>
+                    }
+                </MudButton>
+            }
+        </div>
+    </MudForm>
+</MudPaper>
+
+@code {
+    [Parameter] public UpdateInvoiceRequest Data { get; set; } = new();
+    [Parameter] public bool ReadOnly { get; set; } = false;
+    [Parameter] public EventCallback OnCancel { get; set; }
+    [Parameter] public EventCallback OnSuccess { get; set; }
+
+    private MudForm _form = default!;
+    private UpdateInvoiceRequest _model = new();
+    private List<InvoiceSalesOrderItemResponse> _items = new();
+    private InvoiceLookupResponse _lookup = new();
+    private decimal _beforeTax = 0;
+    private decimal _taxAmount = 0;
+    private decimal _afterTax = 0;
+    private bool _processing = false;
+    private bool _isPrinting = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var resLookup = await InvoiceService.GetInvoiceLookupAsync();
+        if (resLookup != null && resLookup.IsSuccess) _lookup = resLookup.Value ?? new();
+
+        _model = Data;
+        await RefreshItems();
+    }
+
+    private async Task OnSalesOrderChanged(string soId)
+    {
+        if (ReadOnly || _model.SalesOrderId == soId) return;
+        _model.SalesOrderId = soId;
+        await RefreshItems();
+        Snackbar.Add("Sales Order reference changed. Payment summary and items have been updated.", Severity.Info);
+    }
+
+    private async Task RefreshItems()
+    {
+        if (string.IsNullOrEmpty(_model.SalesOrderId)) return;
+
+        try
+        {
+            var response = await InvoiceService.GetSalesOrderDetailForInvoiceAsync(_model.SalesOrderId);
+            await Task.Delay(500);
+            
+            if (response != null && response.IsSuccess && response.Value != null)
+            {
+                _items = response.Value.Items ?? new();
+                _beforeTax = response.Value.BeforeTaxAmount ?? 0;
+                _taxAmount = response.Value.TaxAmount ?? 0;
+                _afterTax = response.Value.AfterTaxAmount ?? 0;
+                StateHasChanged();
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+    }
+
+    private async Task DownloadPdf()
+    {
+        try
+        {
+            _isPrinting = true;
+            StateHasChanged();
+            await Task.Delay(1000);
+
+            var response = await InvoiceService.GetInvoiceByIdAsync(_model.Id!);
+            if (response != null && response.IsSuccess && response.Value != null)
+            {
+                var pdfBytes = InvoicePdfGenerator.Generate(response.Value);
+                var fileName = $"INV_{response.Value.AutoNumber}.pdf";
+                var base64 = Convert.ToBase64String(pdfBytes);
+                await JSRuntime.InvokeVoidAsync("downloadFile", fileName, "application/pdf", base64);
+                Snackbar.Add("PDF generated successfully.", Severity.Success);
+            }
+        }
+        finally
+        {
+            _isPrinting = false;
+            StateHasChanged();
+        }
+    }
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+
+        _processing = true;
+        try
+        {
+            var response = await InvoiceService.UpdateInvoiceAsync(_model);
+            await Task.Delay(500);
+
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Updated successfully", Severity.Success);
+                await OnSuccess.InvokeAsync();
+            }
+        }
+        finally
+        {
+            _processing = false;
+        }
+    }
+}

Features/Sales/Invoice/Cqrs/CreateInvoiceHandler.cs

@@ -0,0 +1,55 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Infrastructure.Database;
+using MediatR;
+
+namespace Indotalent.Features.Sales.Invoice.Cqrs;
+
+public class CreateInvoiceRequest
+{
+    public DateTime? InvoiceDate { get; set; }
+    public Data.Enums.InvoiceStatus InvoiceStatus { get; set; }
+    public string? Description { get; set; }
+    public string? SalesOrderId { get; set; }
+}
+
+public class CreateInvoiceResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+}
+
+public record CreateInvoiceCommand(CreateInvoiceRequest Data) : IRequest<CreateInvoiceResponse>;
+
+public class CreateInvoiceHandler : IRequestHandler<CreateInvoiceCommand, CreateInvoiceResponse>
+{
+    private readonly AppDbContext _context;
+    public CreateInvoiceHandler(AppDbContext context) => _context = context;
+
+    public async Task<CreateInvoiceResponse> Handle(CreateInvoiceCommand request, CancellationToken cancellationToken)
+    {
+        var entityName = nameof(Data.Entities.Invoice);
+        var autoNo = await _context.GenerateAutoNumberAsync(
+            entityName: entityName,
+            prefixTemplate: $"INV/{{Year}}/{{Month}}/",
+            ct: cancellationToken
+        );
+
+        var entity = new Data.Entities.Invoice
+        {
+            AutoNumber = autoNo,
+            InvoiceDate = request.Data.InvoiceDate,
+            InvoiceStatus = request.Data.InvoiceStatus,
+            Description = request.Data.Description,
+            SalesOrderId = request.Data.SalesOrderId
+        };
+
+        _context.Invoice.Add(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+
+        return new CreateInvoiceResponse
+        {
+            Id = entity.Id,
+            AutoNumber = entity.AutoNumber
+        };
+    }
+}

Features/Sales/Invoice/Cqrs/CreateInvoiceValidator.cs

@@ -0,0 +1,12 @@
+using FluentValidation;
+
+namespace Indotalent.Features.Sales.Invoice.Cqrs;
+
+public class CreateInvoiceValidator : AbstractValidator<CreateInvoiceRequest>
+{
+    public CreateInvoiceValidator()
+    {
+        RuleFor(x => x.InvoiceDate).NotEmpty().WithMessage("Date is required");
+        RuleFor(x => x.SalesOrderId).NotEmpty().WithMessage("Sales Order is required");
+    }
+}

Features/Sales/Invoice/Cqrs/DeleteInvoiceByIdHandler.cs

@@ -0,0 +1,25 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.Invoice.Cqrs;
+
+public record DeleteInvoiceByIdCommand(string Id) : IRequest<bool>;
+
+public class DeleteInvoiceByIdHandler : IRequestHandler<DeleteInvoiceByIdCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public DeleteInvoiceByIdHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(DeleteInvoiceByIdCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.Invoice
+            .FirstOrDefaultAsync(x => x.Id == request.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        _context.Invoice.Remove(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+        return true;
+    }
+}

Features/Sales/Invoice/Cqrs/GetInvoiceByIdHandler.cs

@@ -0,0 +1,108 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.Invoice.Cqrs;
+
+public class InvoiceSalesOrderItemResponse
+{
+    public string? Id { get; set; }
+    public string? ProductId { get; set; }
+    public string? ProductName { get; set; }
+    public string? Summary { get; set; }
+    public decimal? UnitPrice { get; set; }
+    public double? Quantity { get; set; }
+    public decimal? Total { get; set; }
+}
+
+public class GetInvoiceByIdResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+    public DateTime? InvoiceDate { get; set; }
+    public Data.Enums.InvoiceStatus InvoiceStatus { get; set; }
+    public string? Description { get; set; }
+    public string? SalesOrderId { get; set; }
+    public string? SalesOrderAutoNumber { get; set; }
+    public string? CustomerName { get; set; }
+    public string? CustomerStreet { get; set; }
+    public string? CustomerCity { get; set; }
+    public string? CompanyName { get; set; }
+    public string? CompanyStreet { get; set; }
+    public string? CompanyCity { get; set; }
+    public string? CompanyState { get; set; }
+    public string? CompanyZipCode { get; set; }
+    public string? CompanyPhone { get; set; }
+    public string? CurrencySymbol { get; set; }
+    public decimal? BeforeTaxAmount { get; set; }
+    public decimal? TaxAmount { get; set; }
+    public decimal? AfterTaxAmount { get; set; }
+    public DateTimeOffset? CreatedAt { get; set; }
+    public string? CreatedBy { get; set; }
+    public DateTimeOffset? UpdatedAt { get; set; }
+    public string? UpdatedBy { get; set; }
+    public List<InvoiceSalesOrderItemResponse> Items { get; set; } = new();
+}
+
+public record GetInvoiceByIdQuery(string Id) : IRequest<GetInvoiceByIdResponse?>;
+
+public class GetInvoiceByIdHandler : IRequestHandler<GetInvoiceByIdQuery, GetInvoiceByIdResponse?>
+{
+    private readonly AppDbContext _context;
+    public GetInvoiceByIdHandler(AppDbContext context) => _context = context;
+
+    public async Task<GetInvoiceByIdResponse?> Handle(GetInvoiceByIdQuery request, CancellationToken cancellationToken)
+    {
+        var company = await _context.Company
+            .AsNoTracking()
+            .Include(x => x.Currency)
+            .OrderByDescending(x => x.IsDefault)
+            .FirstOrDefaultAsync(cancellationToken);
+
+        return await _context.Invoice
+            .AsNoTracking()
+            .Include(x => x.SalesOrder)
+                .ThenInclude(x => x!.Customer)
+            .Include(x => x.SalesOrder)
+                .ThenInclude(x => x!.SalesOrderItemList)
+                    .ThenInclude(x => x.Product)
+            .Where(x => x.Id == request.Id)
+            .Select(x => new GetInvoiceByIdResponse
+            {
+                Id = x.Id,
+                AutoNumber = x.AutoNumber,
+                InvoiceDate = x.InvoiceDate,
+                InvoiceStatus = x.InvoiceStatus,
+                Description = x.Description,
+                SalesOrderId = x.SalesOrderId,
+                SalesOrderAutoNumber = x.SalesOrder!.AutoNumber,
+                CustomerName = x.SalesOrder!.Customer!.Name,
+                CustomerStreet = x.SalesOrder!.Customer!.Street,
+                CustomerCity = x.SalesOrder!.Customer!.City,
+                CompanyName = company != null ? company.Name : string.Empty,
+                CompanyStreet = company != null ? company.StreetAddress : string.Empty,
+                CompanyCity = company != null ? company.City : string.Empty,
+                CompanyState = company != null ? company.StateProvince : string.Empty,
+                CompanyZipCode = company != null ? company.ZipCode : string.Empty,
+                CompanyPhone = company != null ? company.Phone : string.Empty,
+                CurrencySymbol = company != null && company.Currency != null ? company.Currency.Symbol : "IDR",
+                BeforeTaxAmount = x.SalesOrder!.BeforeTaxAmount,
+                TaxAmount = x.SalesOrder!.TaxAmount,
+                AfterTaxAmount = x.SalesOrder!.AfterTaxAmount,
+                CreatedAt = x.CreatedAt,
+                CreatedBy = x.CreatedBy,
+                UpdatedAt = x.UpdatedAt,
+                UpdatedBy = x.UpdatedBy,
+                Items = x.SalesOrder!.SalesOrderItemList.Select(i => new InvoiceSalesOrderItemResponse
+                {
+                    Id = i.Id,
+                    ProductId = i.ProductId,
+                    ProductName = i.Product!.Name,
+                    Summary = i.Summary,
+                    UnitPrice = i.UnitPrice,
+                    Quantity = i.Quantity,
+                    Total = i.Total
+                }).ToList()
+            }).FirstOrDefaultAsync(cancellationToken);
+    }
+}

Features/Sales/Invoice/Cqrs/GetInvoiceListHandler.cs

@@ -0,0 +1,43 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.Invoice.Cqrs;
+
+public class GetInvoiceListResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+    public DateTime? InvoiceDate { get; set; }
+    public string? SalesOrderAutoNumber { get; set; }
+    public string? CustomerName { get; set; }
+    public decimal? AfterTaxAmount { get; set; }
+    public Data.Enums.InvoiceStatus InvoiceStatus { get; set; }
+}
+
+public record GetInvoiceListQuery() : IRequest<List<GetInvoiceListResponse>>;
+
+public class GetInvoiceListHandler : IRequestHandler<GetInvoiceListQuery, List<GetInvoiceListResponse>>
+{
+    private readonly AppDbContext _context;
+    public GetInvoiceListHandler(AppDbContext context) => _context = context;
+
+    public async Task<List<GetInvoiceListResponse>> Handle(GetInvoiceListQuery request, CancellationToken cancellationToken)
+    {
+        return await _context.Invoice
+            .AsNoTracking()
+            .Include(x => x.SalesOrder)
+                .ThenInclude(so => so!.Customer)
+            .OrderByDescending(x => x.CreatedAt)
+            .Select(x => new GetInvoiceListResponse
+            {
+                Id = x.Id,
+                AutoNumber = x.AutoNumber,
+                InvoiceDate = x.InvoiceDate,
+                SalesOrderAutoNumber = x.SalesOrder!.AutoNumber,
+                CustomerName = x.SalesOrder!.Customer!.Name,
+                AfterTaxAmount = x.SalesOrder!.AfterTaxAmount,
+                InvoiceStatus = x.InvoiceStatus
+            }).ToListAsync(cancellationToken);
+    }
+}

Features/Sales/Invoice/Cqrs/GetInvoiceLookupHandler.cs

@@ -0,0 +1,54 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+using Indotalent.Data.Enums;
+using Indotalent.ConfigBackEnd.Extensions;
+
+namespace Indotalent.Features.Sales.Invoice.Cqrs;
+
+public class InvoiceLookupResponse
+{
+    public List<LookupItem> SalesOrders { get; set; } = new();
+    public List<LookupStatusItem> Statuses { get; set; } = new();
+}
+
+public class LookupItem
+{
+    public string? Id { get; set; }
+    public string? Name { get; set; }
+}
+
+public class LookupStatusItem
+{
+    public int Value { get; set; }
+    public string? Name { get; set; }
+}
+
+public record GetInvoiceLookupQuery() : IRequest<InvoiceLookupResponse>;
+
+public class GetInvoiceLookupHandler : IRequestHandler<GetInvoiceLookupQuery, InvoiceLookupResponse>
+{
+    private readonly AppDbContext _context;
+    public GetInvoiceLookupHandler(AppDbContext context) => _context = context;
+
+    public async Task<InvoiceLookupResponse> Handle(GetInvoiceLookupQuery request, CancellationToken cancellationToken)
+    {
+        var response = new InvoiceLookupResponse();
+
+        response.SalesOrders = await _context.SalesOrder.AsNoTracking()
+            .Where(x => x.OrderStatus == SalesOrderStatus.Confirmed)
+            .OrderByDescending(x => x.CreatedAt)
+            .Select(x => new LookupItem { Id = x.Id, Name = x.AutoNumber })
+            .ToListAsync(cancellationToken);
+
+        response.Statuses = Enum.GetValues(typeof(InvoiceStatus))
+            .Cast<InvoiceStatus>()
+            .Select(x => new LookupStatusItem
+            {
+                Value = (int)x,
+                Name = x.GetDescription()
+            }).ToList();
+
+        return response;
+    }
+}

Features/Sales/Invoice/Cqrs/GetSalesOrderDetailForInvoiceHandler.cs

@@ -0,0 +1,39 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.Invoice.Cqrs;
+
+public record GetSalesOrderDetailForInvoiceQuery(string SalesOrderId) : IRequest<GetInvoiceByIdResponse?>;
+
+public class GetSalesOrderDetailForInvoiceHandler : IRequestHandler<GetSalesOrderDetailForInvoiceQuery, GetInvoiceByIdResponse?>
+{
+    private readonly AppDbContext _context;
+    public GetSalesOrderDetailForInvoiceHandler(AppDbContext context) => _context = context;
+
+    public async Task<GetInvoiceByIdResponse?> Handle(GetSalesOrderDetailForInvoiceQuery request, CancellationToken cancellationToken)
+    {
+        return await _context.SalesOrder
+            .AsNoTracking()
+            .Include(x => x.SalesOrderItemList)
+                .ThenInclude(x => x.Product)
+            .Where(x => x.Id == request.SalesOrderId)
+            .Select(x => new GetInvoiceByIdResponse
+            {
+                SalesOrderId = x.Id,
+                BeforeTaxAmount = x.BeforeTaxAmount,
+                TaxAmount = x.TaxAmount,
+                AfterTaxAmount = x.AfterTaxAmount,
+                Items = x.SalesOrderItemList.Select(i => new InvoiceSalesOrderItemResponse
+                {
+                    Id = i.Id,
+                    ProductId = i.ProductId,
+                    ProductName = i.Product!.Name,
+                    Summary = i.Summary,
+                    UnitPrice = i.UnitPrice,
+                    Quantity = i.Quantity,
+                    Total = i.Total
+                }).ToList()
+            }).FirstOrDefaultAsync(cancellationToken);
+    }
+}

Features/Sales/Invoice/Cqrs/UpdateInvoiceHandler.cs

@@ -0,0 +1,44 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.Invoice.Cqrs;
+
+public class UpdateInvoiceRequest
+{
+    public string? Id { get; set; }
+    public DateTime? InvoiceDate { get; set; }
+    public Data.Enums.InvoiceStatus InvoiceStatus { get; set; }
+    public string? AutoNumber { get; set; }
+    public string? Description { get; set; }
+    public string? SalesOrderId { get; set; }
+    public DateTimeOffset? CreatedAt { get; set; }
+    public string? CreatedBy { get; set; }
+    public DateTimeOffset? UpdatedAt { get; set; }
+    public string? UpdatedBy { get; set; }
+}
+
+public record UpdateInvoiceCommand(UpdateInvoiceRequest Data) : IRequest<bool>;
+
+public class UpdateInvoiceHandler : IRequestHandler<UpdateInvoiceCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public UpdateInvoiceHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(UpdateInvoiceCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.Invoice
+            .FirstOrDefaultAsync(x => x.Id == request.Data.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        entity.InvoiceDate = request.Data.InvoiceDate;
+        entity.InvoiceStatus = request.Data.InvoiceStatus;
+        entity.Description = request.Data.Description;
+        entity.SalesOrderId = request.Data.SalesOrderId;
+
+        await _context.SaveChangesAsync(cancellationToken);
+
+        return true;
+    }
+}

Features/Sales/Invoice/Cqrs/UpdateInvoiceValidator.cs

@@ -0,0 +1,12 @@
+using FluentValidation;
+
+namespace Indotalent.Features.Sales.Invoice.Cqrs;
+
+public class UpdateInvoiceValidator : AbstractValidator<UpdateInvoiceRequest>
+{
+    public UpdateInvoiceValidator()
+    {
+        RuleFor(x => x.Id).NotEmpty();
+        RuleFor(x => x.SalesOrderId).NotEmpty().WithMessage("Sales Order is required");
+    }
+}

Features/Sales/Invoice/InvoiceEndpoint.cs

@@ -0,0 +1,77 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Features.Sales.Invoice.Cqrs;
+using MediatR;
+using Microsoft.AspNetCore.Authentication.JwtBearer;
+
+namespace Indotalent.Features.Sales.Invoice;
+
+public static class InvoiceEndpoint
+{
+    public static void MapInvoiceEndpoints(this IEndpointRouteBuilder app)
+    {
+        var group = app.MapGroup("/invoice").WithTags("Invoices")
+            .RequireAuthorization(policy => policy.AddAuthenticationSchemes(JwtBearerDefaults.AuthenticationScheme)
+            .RequireAuthenticatedUser());
+
+        group.MapGet("/", async (IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetInvoiceListQuery());
+            return result.ToApiResponse("Invoice list retrieved successfully");
+        })
+        .WithName("GetInvoiceList");
+
+        group.MapGet("/{id}", async (string id, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetInvoiceByIdQuery(id));
+            return result.ToApiResponse(result is not null
+                ? "Invoice detail retrieved successfully"
+                : $"Invoice with ID {id} not found");
+        })
+        .WithName("GetInvoiceById");
+
+        group.MapGet("/sales-order-detail/{soId}", async (string soId, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetSalesOrderDetailForInvoiceQuery(soId));
+            return result.ToApiResponse(result is not null
+                ? "Sales order detail for invoice retrieved successfully"
+                : $"Sales order with ID {soId} not found");
+        })
+        .WithName("GetSalesOrderDetailForInvoice");
+
+        group.MapGet("/lookup", async (IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetInvoiceLookupQuery());
+            return result.ToApiResponse("Lookup data retrieved successfully");
+        })
+        .WithName("GetInvoiceLookup");
+
+        group.MapPost("/", async (CreateInvoiceRequest request, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new CreateInvoiceCommand(request));
+            return result.ToApiResponse("Invoice has been created successfully", StatusCodes.Status201Created);
+        })
+        .WithName("CreateInvoice");
+
+        group.MapPost("/update", async (UpdateInvoiceRequest request, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new UpdateInvoiceCommand(request));
+            if (!result)
+            {
+                return ((object?)null).ToApiResponse("Update failed. Invoice not found.");
+            }
+            return result.ToApiResponse("Invoice has been updated successfully");
+        })
+        .WithName("UpdateInvoice");
+
+        group.MapPost("/delete/{id}", async (string id, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new DeleteInvoiceByIdCommand(id));
+            if (!result)
+            {
+                return ((object?)null).ToApiResponse("Delete failed. Invoice not found.");
+            }
+            return true.ToApiResponse("Invoice has been deleted successfully");
+        })
+            .WithName("DeleteInvoiceById");
+    }
+}

Features/Sales/Invoice/InvoicePdfGenerator.cs

@@ -0,0 +1,130 @@
+using QuestPDF.Fluent;
+using QuestPDF.Helpers;
+using QuestPDF.Infrastructure;
+using Indotalent.Features.Sales.Invoice.Cqrs;
+
+namespace Indotalent.Features.Sales.Invoice;
+
+public class InvoicePdfGenerator
+{
+    public static byte[] Generate(GetInvoiceByIdResponse data)
+    {
+        QuestPDF.Settings.License = LicenseType.Community;
+
+        var primaryBlue = "#0D47A1";
+        var textSlate = "#64748b";
+
+        return Document.Create(container =>
+        {
+            container.Page(page =>
+            {
+                page.Size(PageSizes.A4);
+                page.Margin(1.5f, Unit.Centimetre);
+                page.PageColor(Colors.White);
+                page.DefaultTextStyle(x => x.FontSize(9).FontFamily(Fonts.Verdana));
+
+                page.Header().Row(row =>
+                {
+                    row.RelativeItem().Column(col =>
+                    {
+                        col.Item().Text("INVOICE")
+                            .FontSize(20).ExtraBold().FontColor(primaryBlue);
+                        col.Item().Text($"{data.AutoNumber}").FontSize(11).SemiBold();
+                        col.Item().Text($"SO Ref: {data.SalesOrderAutoNumber}").FontSize(9).FontColor(textSlate);
+                    });
+
+                    row.RelativeItem().AlignRight().Column(col =>
+                    {
+                        col.Item().Text(data.CompanyName).FontSize(11).ExtraBold();
+                        col.Item().Text($"{data.CompanyStreet}").FontColor(textSlate);
+                        col.Item().Text($"{data.CompanyCity}, {data.CompanyState} {data.CompanyZipCode}").FontColor(textSlate);
+                        col.Item().Text($"Tel: {data.CompanyPhone}").FontColor(textSlate);
+                    });
+                });
+
+                page.Content().PaddingVertical(20).Column(col =>
+                {
+                    col.Item().Row(row =>
+                    {
+                        row.RelativeItem().Column(c =>
+                        {
+                            c.Item().BorderBottom(1).PaddingBottom(5).Text("BILL TO").FontSize(8).Bold().FontColor(textSlate);
+                            c.Item().PaddingTop(5).Text(data.CustomerName).Bold();
+                            c.Item().Text(data.CustomerStreet);
+                            c.Item().Text(data.CustomerCity);
+                        });
+
+                        row.ConstantItem(40);
+
+                        row.RelativeItem().Column(c =>
+                        {
+                            c.Item().BorderBottom(1).PaddingBottom(5).Text("INVOICE DETAILS").FontSize(8).Bold().FontColor(textSlate);
+                            c.Item().PaddingTop(5).Row(r => {
+                                r.RelativeItem().Text("Invoice Date");
+                                r.RelativeItem().AlignRight().Text(data.InvoiceDate?.ToString("dd MMM yyyy"));
+                            });
+                            c.Item().Row(r => {
+                                r.RelativeItem().Text("Status");
+                                r.RelativeItem().AlignRight().Text(data.InvoiceStatus.ToString().ToUpper()).Bold().FontColor(primaryBlue);
+                            });
+                        });
+                    });
+
+                    col.Item().PaddingTop(20).Table(table =>
+                    {
+                        table.ColumnsDefinition(columns =>
+                        {
+                            columns.ConstantColumn(25);
+                            columns.RelativeColumn(4);
+                            columns.RelativeColumn(2);
+                            columns.RelativeColumn(1.5f);
+                            columns.RelativeColumn(2.5f);
+                        });
+
+                        table.Header(header =>
+                        {
+                            header.Cell().Element(HeaderStyle).Text("#");
+                            header.Cell().Element(HeaderStyle).Text("Product");
+                            header.Cell().Element(HeaderStyle).AlignRight().Text("Unit Price");
+                            header.Cell().Element(HeaderStyle).AlignCenter().Text("Qty");
+                            header.Cell().Element(HeaderStyle).AlignRight().Text($"Total ({data.CurrencySymbol})");
+
+                            static IContainer HeaderStyle(IContainer container) => container.DefaultTextStyle(x => x.SemiBold().FontColor(Colors.White)).PaddingVertical(5).PaddingHorizontal(5).Background("#0D47A1");
+                        });
+
+                        var index = 1;
+                        foreach (var item in data.Items)
+                        {
+                            table.Cell().Element(CellStyle).Text($"{index++}");
+                            table.Cell().Element(CellStyle).Column(c => {
+                                c.Item().Text(item.ProductName).Bold();
+                                if (!string.IsNullOrEmpty(item.Summary)) c.Item().Text(item.Summary).FontSize(8).FontColor(textSlate);
+                            });
+                            table.Cell().Element(CellStyle).AlignRight().Text(item.UnitPrice?.ToString("N2"));
+                            table.Cell().Element(CellStyle).AlignCenter().Text(item.Quantity?.ToString());
+                            table.Cell().Element(CellStyle).AlignRight().Text(item.Total?.ToString("N2"));
+
+                            static IContainer CellStyle(IContainer container) => container.BorderBottom(1).BorderColor("#E2E8F0").PaddingVertical(8).PaddingHorizontal(5);
+                        }
+                    });
+
+                    col.Item().PaddingTop(10).Row(row =>
+                    {
+                        row.RelativeItem().Column(c => {
+                            c.Item().Text("Notes:").FontSize(8).Bold();
+                            c.Item().Text(string.IsNullOrEmpty(data.Description) ? "-" : data.Description).FontSize(8);
+                        });
+                        row.ConstantItem(200).Column(c =>
+                        {
+                            c.Item().Row(r => { r.RelativeItem().Text("Sub Total"); r.RelativeItem().AlignRight().Text(data.BeforeTaxAmount?.ToString("N2")); });
+                            c.Item().Row(r => { r.RelativeItem().Text("Tax Amount"); r.RelativeItem().AlignRight().Text(data.TaxAmount?.ToString("N2")); });
+                            c.Item().PaddingTop(5).BorderTop(1).Row(r => { r.RelativeItem().Text($"TOTAL").Bold(); r.RelativeItem().AlignRight().Text(data.AfterTaxAmount?.ToString("N2")).ExtraBold().FontColor(primaryBlue); });
+                        });
+                    });
+                });
+
+                page.Footer().AlignCenter().Text(x => { x.Span("Page ").FontSize(8); x.CurrentPageNumber().FontSize(8); });
+            });
+        }).GeneratePdf();
+    }
+}

Features/Sales/Invoice/InvoiceService.cs

@@ -0,0 +1,71 @@
+using Indotalent.ConfigBackEnd.Interfaces;
+using Indotalent.ConfigFrontEnd.Common;
+using Indotalent.Features.Sales.Invoice.Cqrs;
+using Indotalent.Infrastructure.Authentication.Identity;
+using Indotalent.Shared.Models;
+using Microsoft.AspNetCore.Components;
+using MudBlazor;
+using RestSharp;
+
+namespace Indotalent.Features.Sales.Invoice;
+
+public class InvoiceService : BaseService
+{
+    private readonly RestClient _client;
+
+    public InvoiceService(
+            IHttpClientFactory clientFactory,
+            NavigationManager nav,
+            ISnackbar snackbar,
+            ICurrentUserService currentUserService,
+            TokenProvider tokenProvider)
+            : base(clientFactory, nav, snackbar, currentUserService, tokenProvider)
+    {
+        _client = new RestClient(nav.BaseUri);
+    }
+
+    public async Task<ApiResponse<List<GetInvoiceListResponse>>?> GetInvoiceListAsync()
+    {
+        var request = new RestRequest("api/invoice", Method.Get);
+        return await ExecuteWithResponseAsync<List<GetInvoiceListResponse>>(_client, request);
+    }
+
+    public async Task<ApiResponse<GetInvoiceByIdResponse>?> GetInvoiceByIdAsync(string id)
+    {
+        var request = new RestRequest($"api/invoice/{id}", Method.Get);
+        return await ExecuteWithResponseAsync<GetInvoiceByIdResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<GetInvoiceByIdResponse>?> GetSalesOrderDetailForInvoiceAsync(string soId)
+    {
+        var request = new RestRequest($"api/invoice/sales-order-detail/{soId}", Method.Get);
+        return await ExecuteWithResponseAsync<GetInvoiceByIdResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<InvoiceLookupResponse>?> GetInvoiceLookupAsync()
+    {
+        var request = new RestRequest("api/invoice/lookup", Method.Get);
+        return await ExecuteWithResponseAsync<InvoiceLookupResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<CreateInvoiceResponse>?> CreateInvoiceAsync(CreateInvoiceRequest data)
+    {
+        var request = new RestRequest("api/invoice", Method.Post);
+        request.AddJsonBody(data);
+        return await ExecuteWithResponseAsync<CreateInvoiceResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<bool>?> UpdateInvoiceAsync(UpdateInvoiceRequest data)
+    {
+        var request = new RestRequest("api/invoice/update", Method.Post);
+        request.AddJsonBody(data);
+        return await ExecuteWithResponseAsync<bool>(_client, request);
+    }
+
+    public async Task<bool> DeleteInvoiceByIdAsync(string id)
+    {
+        var request = new RestRequest($"api/invoice/delete/{id}", Method.Post);
+        var response = await ExecuteWithResponseAsync<object>(_client, request);
+        return response?.IsSuccess ?? false;
+    }
+}

Features/Sales/InvoiceReport/Components/InvoiceReportPage.razor

@@ -0,0 +1,8 @@
+@page "/sales/invoice-report"
+@using Indotalent.Features.Sales.InvoiceReport.Components
+@using MudBlazor
+
+<_InvoiceReportDataTable />
+
+@code {
+}

Features/Sales/InvoiceReport/Components/_InvoiceReportDataTable.razor

@@ -0,0 +1,295 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.InvoiceReport
+@using Indotalent.Features.Sales.InvoiceReport.Cqrs
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using MudBlazor
+@using Features.Root.Shared
+@using ClosedXML.Excel
+@using System.IO
+@inject InvoiceReportService InvoiceReportService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #E5E7EB; border-radius: 12px;">
+    <div>
+        <MudText Typo="Typo.h5" Style="font-weight: 600; color: #111827;">Invoice Report</MudText>
+        <MudText Typo="Typo.body2" Style="color: #9CA3AF;">Summary of customer billing, invoice dates, and payment status.</MudText>
+    </div>
+    <div class="d-flex align-center gap-2">
+        <MudIcon Icon="@Icons.Material.Filled.Home" Size="Size.Small" Color="Color.Default" />
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">Sales</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="font-weight: 600; color: #111827;">Invoice Report</MudText>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; overflow: hidden; background-color: #ffffff; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff; min-height: 80px;">
+        <div style="display: flex; align-items: center; gap: 8px;">
+            <MudTextField @bind-Value="_searchString"
+                          Placeholder="Search Invoice, Customer or Order..."
+                          Adornment="Adornment.Start"
+                          AdornmentIcon="@Icons.Material.Filled.Search"
+                          IconSize="Size.Small"
+                          Class="mt-0"
+                          Variant="Variant.Outlined"
+                          Margin="Margin.Dense"
+                          Style="background-color: white; width: 280px; border-radius: 8px;"
+                          OnKeyDown="@HandleSearchKeyDown" />
+            <MudButton Variant="Variant.Filled"
+                       Color="Color.Primary"
+                       OnClick="OnSearchClick"
+                       Size="Size.Small"
+                       Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px; box-shadow: none;">
+                Search
+            </MudButton>
+        </div>
+
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Success"
+                       OnClick="ExportToExcel"
+                       Size="Size.Small"
+                       Disabled="_isExporting"
+                       StartIcon="@(_isExporting ? null : Icons.Custom.FileFormats.FileExcel)"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isExporting)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Excel</MudText>
+                }
+            </MudButton>
+
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Primary"
+                       OnClick="LoadData"
+                       Size="Size.Small"
+                       StartIcon="@(_isRefreshing ? null : Icons.Material.Filled.Refresh)"
+                       Disabled="_isRefreshing"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isRefreshing)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Refreshing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Refresh</MudText>
+                }
+            </MudButton>
+        </div>
+    </div>
+
+    <MudTable Items="@GetPagedData()" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" CustomHeader="true" Dense="true" T="GetInvoiceReportListDto" Loading="@_isRefreshing">
+        <HeaderContent>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceReportListDto, object>(x => x.CustomerName!)">Customer</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceReportListDto, object>(x => x.Number!)">Invoice Number</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceReportListDto, object>(x => x.InvoiceDate!)">Invoice Date</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceReportListDto, object>(x => x.SalesOrderNumber!)">Sales Order</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceReportListDto, object>(x => x.AfterTaxAmount!)">Total Amount</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetInvoiceReportListDto, object>(x => x.StatusName!)">Status</MudTableSortLabel>
+            </MudTh>
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.CustomerName</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.Number</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.InvoiceDate?.ToString("yyyy-MM-dd")</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.SalesOrderNumber</MudTd>
+            <MudTd Style="text-align: right; font-weight: 700; color: #2e7d32;">@context.AfterTaxAmount?.ToString("N2")</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">
+                <MudChip T="string" Color="Color.Info" Size="Size.Small" Variant="Variant.Text" Style="font-weight: 600;">@context.StatusName.ToUpper()</MudChip>
+            </MudTd>
+        </RowTemplate>
+    </MudTable>
+
+    <div style="display: flex; justify-content: space-between; align-items: center; padding: 12px 24px; background-color: #F9FAFB; border-top: 1px solid #E5E7EB;">
+        <div style="display: flex; align-items: center; gap: 12px;">
+            <MudText Typo="Typo.caption" Style="font-weight: 500; color: #9CA3AF; font-size: 0.75rem;">Rows per page:</MudText>
+            <MudSelect T="int" Value="@_top" ValueChanged="OnPageSizeChanged" Dense="true" Margin="Margin.Dense" Style="width: 80px; background-color: white; font-size: 12px; font-weight: 600;" Variant="Variant.Outlined" Class="mt-0 custom-select-dense">
+                <MudSelectItem Value="5" />
+                <MudSelectItem Value="10" />
+                <MudSelectItem Value="50" />
+                <MudSelectItem Value="500" />
+                <MudSelectItem Value="1000" />
+            </MudSelect>
+            <MudText Typo="Typo.caption" Style="color: #9CA3AF; margin-left: 12px; font-size: 0.75rem; font-weight: 500;">
+                Showing @(GetFilteredData().Count() == 0 ? 0 : _skip + 1)-@Math.Min(_skip + _top, GetFilteredData().Count()) of @GetFilteredData().Count()
+            </MudText>
+        </div>
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudIconButton Icon="@Icons.Material.Filled.FirstPage" Size="Size.Small" OnClick="@(() => OnPageChanged(1))" Disabled="@(_currentPage == 1)" Style="@(_currentPage == 1 ? "color: #D1D5DB; background: transparent;" : "color: #6B7280; background: white; border: 1px solid #D1D5DB; border-radius: 6px;")" />
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage - 1))" Disabled="@(_currentPage == 1)" Variant="Variant.Text" StartIcon="@Icons.Material.Filled.ChevronLeft" Size="Size.Small" Style="@(_currentPage == 1 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Prev</MudButton>
+            @{
+                var totalPages = _totalPage == 0 ? 1 : _totalPage;
+                var maxVisible = 5;
+                var startPage = Math.Max(1, _currentPage - maxVisible / 2);
+                var endPage = Math.Min(totalPages, startPage + maxVisible - 1);
+                if (endPage - startPage < maxVisible - 1) { startPage = Math.Max(1, endPage - maxVisible + 1); }
+            }
+            @for (int i = startPage; i <= endPage; i++)
+            {
+                var pageNum = i;
+                var isActive = pageNum == _currentPage;
+                <MudButton OnClick="@(() => OnPageChanged(pageNum))"
+                           Variant="Variant.Text" Size="Size.Small"
+                           Style="@(isActive ? "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 600; background: #3B82F6; color: white; border: 1px solid #3B82F6; border-radius: 6px; text-transform: none;" : "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 500; color: #374151; background: white; border: 1px solid #D1D5DB; border-radius: 6px; text-transform: none;")">@pageNum</MudButton>
+            }
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage + 1))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Variant="Variant.Text" EndIcon="@Icons.Material.Filled.ChevronRight" Size="Size.Small" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Next</MudButton>
+            <MudIconButton Icon="@Icons.Material.Filled.LastPage" Size="Size.Small" OnClick="@(() => OnPageChanged(_totalPage))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "color: #D1D5DB; background: transparent;" : "background-color: white; border: 1px solid #D1D5DB; color: #6B7280;")" />
+        </div>
+    </div>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    private List<GetInvoiceReportListDto> _items = new();
+    private string _searchString = "";
+    private bool _isRefreshing = false;
+    private bool _isExporting = false;
+
+    private int _skip = 0;
+    private int _top = 50;
+    private int _totalPage => GetFilteredData().Count() == 0 ? 0 : (int)Math.Ceiling((double)GetFilteredData().Count() / (_top == 0 ? 1 : _top));
+    private int _currentPage => (_top >= GetFilteredData().Count() || _top == 0) ? 1 : (_skip / _top) + 1;
+
+    protected override async Task OnInitializedAsync() => await LoadData();
+
+    private async Task LoadData()
+    {
+        _isRefreshing = true;
+        StateHasChanged();
+        try
+        {
+            var response = await InvoiceReportService.GetInvoiceReportListAsync();
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                _items = response.Value ?? new();
+            }
+        }
+        finally
+        {
+            _isRefreshing = false;
+            StateHasChanged();
+        }
+    }
+
+    private IEnumerable<GetInvoiceReportListDto> GetFilteredData()
+    {
+        if (string.IsNullOrWhiteSpace(_searchString)) return _items;
+        return _items.Where(x =>
+            (x.Number?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.CustomerName?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.SalesOrderNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false)
+        );
+    }
+
+    private IEnumerable<GetInvoiceReportListDto> GetPagedData() => GetFilteredData().Skip(_skip).Take(_top);
+
+    private void OnSearchClick()
+    {
+        _skip = 0;
+        StateHasChanged();
+    }
+
+    private void HandleSearchKeyDown(KeyboardEventArgs e)
+    {
+        if (e.Key == "Enter") OnSearchClick();
+    }
+
+    private async Task ExportToExcel()
+    {
+        _isExporting = true;
+        StateHasChanged();
+        try
+        {
+            await Task.Delay(1000);
+            using (var workbook = new XLWorkbook())
+            {
+                var worksheet = workbook.Worksheets.Add("InvoiceReports");
+                var currentRow = 1;
+
+                string[] headers = { "Customer", "Invoice Number", "Invoice Date", "Sales Order", "Total Amount", "Status" };
+                for (int i = 0; i < headers.Length; i++)
+                {
+                    worksheet.Cell(currentRow, i + 1).Value = headers[i];
+                }
+
+                var headerRange = worksheet.Range(1, 1, 1, headers.Length);
+                headerRange.Style.Font.Bold = true;
+                headerRange.Style.Fill.BackgroundColor = XLColor.FromHtml("#0D47A1");
+                headerRange.Style.Font.FontColor = XLColor.White;
+
+                foreach (var item in GetFilteredData())
+                {
+                    currentRow++;
+                    worksheet.Cell(currentRow, 1).Value = item.CustomerName;
+                    worksheet.Cell(currentRow, 2).Value = item.Number;
+                    worksheet.Cell(currentRow, 3).Value = item.InvoiceDate?.ToString("yyyy-MM-dd");
+                    worksheet.Cell(currentRow, 4).Value = item.SalesOrderNumber;
+                    worksheet.Cell(currentRow, 5).Value = item.AfterTaxAmount;
+                    worksheet.Cell(currentRow, 6).Value = item.StatusName;
+                }
+
+                worksheet.Columns().AdjustToContents();
+
+                using (var stream = new MemoryStream())
+                {
+                    workbook.SaveAs(stream);
+                    var content = Convert.ToBase64String(stream.ToArray());
+                    await JSRuntime.InvokeVoidAsync("downloadFile", "Invoice_Report.xlsx", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", content);
+                    Snackbar.Add("Excel exported successfully", Severity.Success);
+                }
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Export failed: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _isExporting = false;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageChanged(int page)
+    {
+        if (page >= 1 && page <= _totalPage)
+        {
+            _skip = (page - 1) * _top;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageSizeChanged(int size)
+    {
+        _top = size;
+        _skip = 0;
+        StateHasChanged();
+    }
+}

Features/Sales/InvoiceReport/Cqrs/GetInvoiceReportListHandler.cs

@@ -0,0 +1,51 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.InvoiceReport.Cqrs;
+
+public record GetInvoiceReportListDto
+{
+    public string? Id { get; init; }
+    public string? Number { get; init; }
+    public DateTime? InvoiceDate { get; init; }
+    public string? StatusName { get; init; }
+    public string? SalesOrderNumber { get; init; }
+    public decimal? AfterTaxAmount { get; init; }
+    public string? CustomerName { get; init; }
+}
+
+public record GetInvoiceReportListQuery() : IRequest<List<GetInvoiceReportListDto>>;
+
+public class GetInvoiceReportListHandler : IRequestHandler<GetInvoiceReportListQuery, List<GetInvoiceReportListDto>>
+{
+    private readonly AppDbContext _context;
+
+    public GetInvoiceReportListHandler(AppDbContext context)
+    {
+        _context = context;
+    }
+
+    public async Task<List<GetInvoiceReportListDto>> Handle(GetInvoiceReportListQuery request, CancellationToken cancellationToken)
+    {
+        var results = await _context.Invoice
+            .AsNoTracking()
+            .Include(x => x.SalesOrder)
+                .ThenInclude(x => x!.Customer)
+            .OrderByDescending(x => x.InvoiceDate)
+            .Select(x => new GetInvoiceReportListDto
+            {
+                Id = x.Id,
+                Number = x.AutoNumber,
+                InvoiceDate = x.InvoiceDate,
+                StatusName = x.InvoiceStatus.GetDescription(),
+                SalesOrderNumber = x.SalesOrder != null ? x.SalesOrder.AutoNumber : string.Empty,
+                AfterTaxAmount = x.SalesOrder != null ? x.SalesOrder.AfterTaxAmount : 0,
+                CustomerName = (x.SalesOrder != null && x.SalesOrder.Customer != null) ? x.SalesOrder.Customer.Name : string.Empty
+            })
+            .ToListAsync(cancellationToken);
+
+        return results;
+    }
+}

Features/Sales/InvoiceReport/InvoiceReportEndpoint.cs

@@ -0,0 +1,23 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Features.Sales.InvoiceReport.Cqrs;
+using MediatR;
+using Microsoft.AspNetCore.Authentication.JwtBearer;
+
+namespace Indotalent.Features.Sales.InvoiceReport;
+
+public static class InvoiceReportEndpoint
+{
+    public static void MapInvoiceReportEndpoints(this IEndpointRouteBuilder app)
+    {
+        var group = app.MapGroup("/invoice-report").WithTags("InvoiceReports")
+            .RequireAuthorization(policy => policy.AddAuthenticationSchemes(JwtBearerDefaults.AuthenticationScheme)
+            .RequireAuthenticatedUser());
+
+        group.MapGet("/", async (IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetInvoiceReportListQuery());
+            return result.ToApiResponse("Invoice report list retrieved successfully");
+        })
+        .WithName("GetInvoiceReportList");
+    }
+}

Features/Sales/InvoiceReport/InvoiceReportService.cs

@@ -0,0 +1,32 @@
+using Indotalent.ConfigBackEnd.Interfaces;
+using Indotalent.ConfigFrontEnd.Common;
+using Indotalent.Features.Sales.InvoiceReport.Cqrs;
+using Indotalent.Infrastructure.Authentication.Identity;
+using Indotalent.Shared.Models;
+using Microsoft.AspNetCore.Components;
+using MudBlazor;
+using RestSharp;
+
+namespace Indotalent.Features.Sales.InvoiceReport;
+
+public class InvoiceReportService : BaseService
+{
+    private readonly RestClient _client;
+
+    public InvoiceReportService(
+            IHttpClientFactory clientFactory,
+            NavigationManager nav,
+            ISnackbar snackbar,
+            ICurrentUserService currentUserService,
+            TokenProvider tokenProvider)
+            : base(clientFactory, nav, snackbar, currentUserService, tokenProvider)
+    {
+        _client = new RestClient(nav.BaseUri);
+    }
+
+    public async Task<ApiResponse<List<GetInvoiceReportListDto>>?> GetInvoiceReportListAsync()
+    {
+        var request = new RestRequest("api/invoice-report", Method.Get);
+        return await ExecuteWithResponseAsync<List<GetInvoiceReportListDto>>(_client, request);
+    }
+}

Features/Sales/PaymentReceive/Components/PaymentReceivePage.razor

@@ -0,0 +1,51 @@
+@page "/sales/payment-receive"
+@using Indotalent.Features.Sales.PaymentReceive.Cqrs
+@using Indotalent.Features.Sales.PaymentReceive.Components
+@using MudBlazor
+
+@if (_currentView == ViewMode.Create)
+{
+    <_PaymentReceiveCreateForm OnCancel="BackToTable" OnSuccess="HandleSuccess" />
+}
+else if (_currentView == ViewMode.Update || _currentView == ViewMode.View)
+{
+    <_PaymentReceiveUpdateForm Data="_selectedData!"
+                               ReadOnly="@(_currentView == ViewMode.View)"
+                               OnCancel="BackToTable"
+                               OnSuccess="HandleSuccess" />
+}
+else
+{
+    <_PaymentReceiveDataTable OnAdd="() => ShowCreate()"
+                              OnEdit="(item) => ShowUpdate(item, false)"
+                              OnView="(item) => ShowUpdate(item, true)" />
+}
+
+@code {
+    private enum ViewMode { Table, Create, Update, View }
+    private ViewMode _currentView = ViewMode.Table;
+    private UpdatePaymentReceiveRequest? _selectedData;
+
+    private void ShowCreate()
+    {
+        _currentView = ViewMode.Create;
+    }
+
+    private void ShowUpdate(UpdatePaymentReceiveRequest data, bool isReadOnly)
+    {
+        _selectedData = data;
+        _currentView = isReadOnly ? ViewMode.View : ViewMode.Update;
+    }
+
+    private void BackToTable()
+    {
+        _currentView = ViewMode.Table;
+        _selectedData = null;
+    }
+
+    private void HandleSuccess()
+    {
+        _currentView = ViewMode.Table;
+        _selectedData = null;
+    }
+}

Features/Sales/PaymentReceive/Components/_PaymentReceiveCreateForm.razor

@@ -0,0 +1,216 @@
+@using Indotalent.Features.Sales.PaymentReceive.Cqrs
+@using Indotalent.Shared.Utils
+@using MudBlazor
+@inject PaymentReceiveService PaymentReceiveService
+@inject ISnackbar Snackbar
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #DCEBFA;">
+    <div class="d-flex align-center gap-4">
+        <MudIconButton Icon="@Icons.Material.Filled.ArrowBack" OnClick="() => OnCancel.InvokeAsync()" />
+        <div>
+            <MudText Typo="Typo.h5" Style="font-weight: 900; color: #1a1a1a;">Add Payment Receive</MudText>
+            <MudText Typo="Typo.body2" Style="color: #64748b;">Process customer payment for an existing invoice.</MudText>
+        </div>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 4px; border: 1px solid #DCEBFA;">
+    <MudForm @ref="_form" Model="_model">
+        <MudGrid Spacing="3">
+            <MudItem xs="12"><MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Basic Information</MudText><MudDivider /></MudItem>
+            
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Payment Date</MudText>
+                <MudDatePicker @bind-Date="_model.PaymentDate"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Invoice Reference</MudText>
+                <MudSelect T="string" Value="_model.InvoiceId"
+                           ValueChanged="OnInvoiceChanged"
+                           For="@(() => _model.InvoiceId)"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Invoices)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Payment Method</MudText>
+                <MudSelect T="string" @bind-Value="_model.PaymentMethodId"
+                           For="@(() => _model.PaymentMethodId)"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.PaymentMethods)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Status</MudText>
+                <MudSelect T="Indotalent.Data.Enums.PaymentReceiveStatus" @bind-Value="_model.Status"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Statuses)
+                    {
+                        <MudSelectItem Value="@((Indotalent.Data.Enums.PaymentReceiveStatus)item.Value)">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Payment Amount</MudText>
+                <MudNumericField @bind-Value="_model.PaymentAmount"
+                                 Format="N2"
+                                 Variant="Variant.Outlined" Margin="Margin.Dense" FullWidth="true" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Customer</MudText>
+                <MudTextField Value="@_customerName" ReadOnly="true"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" FullWidth="true" Style="background-color: #f1f5f9;" />
+            </MudItem>
+
+            <MudItem xs="12">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
+                <MudTextField @bind-Value="_model.Description"
+                              For="@(() => _model.Description)"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-6">
+                <_PaymentReceiveItemDataTable Items="_items" />
+            </MudItem>
+
+            <MudItem xs="12" sm="7"></MudItem>
+            <MudItem xs="12" sm="5">
+                <MudPaper Elevation="0" Outlined="true" Class="pa-4" Style="border-radius: 4px; background-color: #F8FAFC; border: 1px solid #DCEBFA;">
+                    <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;" Class="mb-4 d-block">Invoice Commercial Summary</MudText>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Sub Total</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_invoiceSubTotal.ToString("N2")</MudText>
+                    </div>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Tax Amount</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_invoiceTax.ToString("N2")</MudText>
+                    </div>
+                    <MudDivider Class="my-2" />
+                    <div class="d-flex justify-space-between">
+                        <MudText Typo="Typo.subtitle1" Style="font-weight: 900;">Grand Total</MudText>
+                        <MudText Typo="Typo.subtitle1" Color="Color.Primary" Style="font-weight: 900;">@_invoiceGrandTotal.ToString("N2")</MudText>
+                    </div>
+                </MudPaper>
+            </MudItem>
+        </MudGrid>
+
+        <div class="d-flex justify-end gap-2 mt-8">
+            <MudButton OnClick="() => OnCancel.InvokeAsync()"
+                       Variant="Variant.Outlined"
+                       Disabled="_processing"
+                       Style="border-radius: 4px; text-transform: none; font-weight: 700;border: 1px solid #e0e0e0;">
+                Cancel
+            </MudButton>
+            <MudButton Color="Color.Primary"
+                       Variant="Variant.Filled"
+                       OnClick="Submit"
+                       Disabled="_processing"
+                       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" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText>Process Payment</MudText>
+                }
+            </MudButton>
+        </div>
+    </MudForm>
+</MudPaper>
+
+@code {
+    [Parameter] public EventCallback OnCancel { get; set; }
+    [Parameter] public EventCallback OnSuccess { get; set; }
+
+    private MudForm _form = default!;
+    private CreatePaymentReceiveRequest _model = new() { PaymentDate = DateTime.Today, Status = Indotalent.Data.Enums.PaymentReceiveStatus.Draft };
+    private PaymentReceiveLookupResponse _lookup = new();
+    private List<PaymentReceiveItemResponse> _items = new();
+    
+    private string _customerName = "";
+    private decimal _invoiceSubTotal = 0;
+    private decimal _invoiceTax = 0;
+    private decimal _invoiceGrandTotal = 0;
+    private bool _processing = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var res = await PaymentReceiveService.GetPaymentReceiveLookupAsync();
+        if (res != null && res.IsSuccess) _lookup = res.Value ?? new();
+    }
+
+    private async Task OnInvoiceChanged(string invoiceId)
+    {
+        _model.InvoiceId = invoiceId;
+        if (string.IsNullOrEmpty(invoiceId))
+        {
+            ResetInvoiceData();
+            return;
+        }
+
+        var res = await PaymentReceiveService.GetInvoiceDetailForPaymentAsync(invoiceId);
+        await Task.Delay(500);
+        if (res != null && res.IsSuccess && res.Value != null)
+        {
+            _items = res.Value.Items;
+            _customerName = res.Value.CustomerName ?? "";
+            _invoiceSubTotal = res.Value.SalesOrderBeforeTaxAmount;
+            _invoiceTax = res.Value.SalesOrderTaxAmount;
+            _invoiceGrandTotal = res.Value.SalesOrderAfterTaxAmount;
+            
+            _model.PaymentAmount = res.Value.PaymentAmount;
+            
+            Snackbar.Add($"Invoice {res.Value.InvoiceNumber} items loaded.", Severity.Info);
+        }
+    }
+
+    private void ResetInvoiceData()
+    {
+        _items.Clear();
+        _customerName = "";
+        _invoiceSubTotal = 0;
+        _invoiceTax = 0;
+        _invoiceGrandTotal = 0;
+        _model.PaymentAmount = 0;
+    }
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+
+        _processing = true;
+        try
+        {
+            var response = await PaymentReceiveService.CreatePaymentReceiveAsync(_model);
+            await Task.Delay(500);
+
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Payment recorded successfully", Severity.Success);
+                await OnSuccess.InvokeAsync();
+            }
+        }
+        finally
+        {
+            _processing = false;
+        }
+    }
+}

Features/Sales/PaymentReceive/Components/_PaymentReceiveDataTable.razor

@@ -0,0 +1,385 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.PaymentReceive
+@using Indotalent.Features.Sales.PaymentReceive.Cqrs
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using MudBlazor
+@using Features.Root.Shared
+@using ClosedXML.Excel
+@using System.IO
+@inject PaymentReceiveService PaymentReceiveService
+@inject IDialogService DialogService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #E5E7EB; border-radius: 12px;">
+    <div>
+        <MudText Typo="Typo.h5" Style="font-weight: 600; color: #111827;">Payment Receive</MudText>
+        <MudText Typo="Typo.body2" Style="color: #9CA3AF;">Record and manage customer payments for invoices.</MudText>
+    </div>
+    <div class="d-flex align-center gap-2">
+        <MudIcon Icon="@Icons.Material.Filled.Home" Size="Size.Small" Color="Color.Default" />
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">Sales</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="font-weight: 600; color: #111827;">Payment Receive</MudText>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; overflow: hidden; background-color: #ffffff; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff; min-height: 80px;">
+        <div style="display: flex; align-items: center; gap: 8px;">
+            <MudTextField @bind-Value="_searchString"
+                          Placeholder="Search..."
+                          Adornment="Adornment.Start"
+                          AdornmentIcon="@Icons.Material.Filled.Search"
+                          IconSize="Size.Small"
+                          Class="mt-0"
+                          Variant="Variant.Outlined"
+                          Margin="Margin.Dense"
+                          Style="background-color: white; width: 280px; border-radius: 8px;"
+                          OnKeyDown="@HandleSearchKeyDown" />
+            <MudButton Variant="Variant.Filled"
+                       Color="Color.Primary"
+                       OnClick="OnSearchClick"
+                       Size="Size.Small"
+                       Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px; box-shadow: none;">
+                Search
+            </MudButton>
+        </div>
+
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Success"
+                       OnClick="ExportToExcel"
+                       Size="Size.Small"
+                       Disabled="_isExporting"
+                       StartIcon="@(_isExporting ? null : Icons.Custom.FileFormats.FileExcel)"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isExporting)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Excel</MudText>
+                }
+            </MudButton>
+
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Primary"
+                       OnClick="LoadData"
+                       Size="Size.Small"
+                       StartIcon="@(_isRefreshing ? null : Icons.Material.Filled.Refresh)"
+                       Disabled="_isRefreshing"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isRefreshing)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Refreshing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Refresh</MudText>
+                }
+            </MudButton>
+
+            @if (_selectedItem != null)
+            {
+                <MudButton Variant="Variant.Outlined" Color="Color.Info" StartIcon="@Icons.Material.Filled.Visibility" OnClick="InvokeView" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background-color: white; border: 1px solid #D1D5DB; color: #6B7280;">View</MudButton>
+                <MudButton Variant="Variant.Outlined" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Edit" OnClick="InvokeEdit" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background-color: white; border: 1px solid #D1D5DB; color: #6B7280;">Edit</MudButton>
+                <MudButton Variant="Variant.Outlined" Color="Color.Error" StartIcon="@Icons.Material.Filled.Delete" OnClick="OnDelete" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background: white; border: 1px solid #FCA5A5; color: #EF4444;">Remove</MudButton>
+                <MudIconButton Icon="@Icons.Material.Filled.Close" Size="Size.Small" OnClick="() => _selectedItem = null" />
+            }
+            else
+            {
+                <MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add" OnClick="() => OnAdd.InvokeAsync()" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px;">
+                    Add Payment Receive
+                </MudButton>
+            }
+        </div>
+    </div>
+
+    <MudTable Items="@GetPagedData()" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" CustomHeader="true" Dense="true" T="GetPaymentReceiveListResponse" OnRowClick="@((args) => _selectedItem = args.Item)" Loading="@_isRefreshing">
+        <HeaderContent>
+            <MudTh Style="width: 50px; background-color: #ffffff; border-bottom: 1px solid #E5E7EB;"></MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveListResponse, object>(x => x.AutoNumber!)">Payment No</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveListResponse, object>(x => x.PaymentDate!)">Date</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveListResponse, object>(x => x.InvoiceNumber!)">Invoice Ref</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveListResponse, object>(x => x.CustomerName!)">Customer</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveListResponse, object>(x => x.PaymentAmount!)">Amount</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveListResponse, object>(x => x.Status)">Status</MudTableSortLabel>
+            </MudTh>
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd>
+                <MudCheckBox T="bool" Value="@(_selectedItem?.Id == context.Id)" Color="Color.Primary" Dense="true" Size="Size.Small" ReadOnly="true" />
+            </MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.AutoNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.PaymentDate?.ToString("yyyy-MM-dd")</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.InvoiceNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.CustomerName</MudTd>
+            <MudTd Style="text-align: right; font-weight: 700;">@context.PaymentAmount.ToString("N2")</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">
+                <MudChip T="string" Color="Color.Info" Size="Size.Small" Variant="Variant.Text" Style="font-weight: 600;">@context.Status.ToString().ToUpper()</MudChip>
+            </MudTd>
+        </RowTemplate>
+    </MudTable>
+
+    <div style="display: flex; justify-content: space-between; align-items: center; padding: 12px 24px; background-color: #F9FAFB; border-top: 1px solid #E5E7EB;">
+        <div style="display: flex; align-items: center; gap: 12px;">
+            <MudText Typo="Typo.caption" Style="font-weight: 500; color: #9CA3AF; font-size: 0.75rem;">Rows per page:</MudText>
+            <MudSelect T="int" Value="@_top" ValueChanged="OnPageSizeChanged" Dense="true" Margin="Margin.Dense" Style="width: 80px; background-color: white; font-size: 12px; font-weight: 600;" Variant="Variant.Outlined" Class="mt-0">
+                <MudSelectItem Value="5" />
+                <MudSelectItem Value="10" />
+                <MudSelectItem Value="50" />
+                <MudSelectItem Value="500" />
+                <MudSelectItem Value="1000" />
+            </MudSelect>
+            <MudText Typo="Typo.caption" Style="color: #9CA3AF; margin-left: 12px; font-size: 0.75rem; font-weight: 500;">
+                Showing @(GetFilteredData().Count() == 0 ? 0 : _skip + 1)-@Math.Min(_skip + _top, GetFilteredData().Count()) of @GetFilteredData().Count()
+            </MudText>
+        </div>
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudIconButton Icon="@Icons.Material.Filled.FirstPage" Size="Size.Small" OnClick="@(() => OnPageChanged(1))" Disabled="@(_currentPage == 1)" Style="@(_currentPage == 1 ? "color: #D1D5DB; background: transparent;" : "color: #6B7280; background: white; border: 1px solid #D1D5DB; border-radius: 6px;")" />
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage - 1))" Disabled="@(_currentPage == 1)" Variant="Variant.Text" StartIcon="@Icons.Material.Filled.ChevronLeft" Size="Size.Small" Style="@(_currentPage == 1 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Prev</MudButton>
+            @{
+                var totalPages = _totalPage == 0 ? 1 : _totalPage;
+                var maxVisible = 5;
+                var startPage = Math.Max(1, _currentPage - maxVisible / 2);
+                var endPage = Math.Min(totalPages, startPage + maxVisible - 1);
+                if (endPage - startPage < maxVisible - 1) { startPage = Math.Max(1, endPage - maxVisible + 1); }
+            }
+            @for (int i = startPage; i <= endPage; i++)
+            {
+                var pageNum = i;
+                var isActive = pageNum == _currentPage;
+                <MudButton OnClick="@(() => OnPageChanged(pageNum))"
+                           Variant="Variant.Text" Size="Size.Small"
+                           Style="@(isActive ? "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 600; background: #3B82F6; color: white; border: 1px solid #3B82F6; border-radius: 6px; text-transform: none;" : "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 500; color: #374151; background: white; border: 1px solid #D1D5DB; border-radius: 6px; text-transform: none;")">@pageNum</MudButton>
+            }
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage + 1))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Variant="Variant.Text" EndIcon="@Icons.Material.Filled.ChevronRight" Size="Size.Small" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Next</MudButton>
+            <MudIconButton Icon="@Icons.Material.Filled.LastPage" Size="Size.Small" OnClick="@(() => OnPageChanged(_totalPage))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "color: #D1D5DB; background: transparent;" : "background-color: white; border: 1px solid #D1D5DB; color: #6B7280;")" />
+        </div>
+    </div>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    [Parameter] public EventCallback OnAdd { get; set; }
+    [Parameter] public EventCallback<UpdatePaymentReceiveRequest> OnEdit { get; set; }
+    [Parameter] public EventCallback<UpdatePaymentReceiveRequest> OnView { get; set; }
+
+    private List<GetPaymentReceiveListResponse> _items = new();
+    private GetPaymentReceiveListResponse? _selectedItem;
+    private string _searchString = "";
+    private bool _isRefreshing = false;
+    private bool _isExporting = false;
+
+    private int _skip = 0;
+    private int _top = 5;
+    private int _totalPage => GetFilteredData().Count() == 0 ? 0 : (int)Math.Ceiling((double)GetFilteredData().Count() / (_top == 0 ? 1 : _top));
+    private int _currentPage => (_top >= GetFilteredData().Count() || _top == 0) ? 1 : (_skip / _top) + 1;
+
+    protected override async Task OnInitializedAsync() => await LoadData();
+
+    private async Task LoadData()
+    {
+        _isRefreshing = true;
+        _selectedItem = null;
+        StateHasChanged();
+        try
+        {
+            var response = await PaymentReceiveService.GetPaymentReceiveListAsync();
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                _items = response.Value ?? new();
+            }
+        }
+        finally
+        {
+            _isRefreshing = false;
+            StateHasChanged();
+        }
+    }
+
+    private IEnumerable<GetPaymentReceiveListResponse> GetFilteredData()
+    {
+        if (string.IsNullOrWhiteSpace(_searchString)) return _items;
+        return _items.Where(x =>
+            (x.AutoNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.InvoiceNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.CustomerName?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false)
+        );
+    }
+
+    private IEnumerable<GetPaymentReceiveListResponse> GetPagedData() => GetFilteredData().Skip(_skip).Take(_top);
+
+    private void OnSearchClick()
+    {
+        _skip = 0;
+        _selectedItem = null;
+        StateHasChanged();
+    }
+
+    private void HandleSearchKeyDown(KeyboardEventArgs e)
+    {
+        if (e.Key == "Enter") OnSearchClick();
+    }
+
+    private async Task ExportToExcel()
+    {
+        _isExporting = true;
+        StateHasChanged();
+        try
+        {
+            await Task.Delay(1000);
+            using (var workbook = new XLWorkbook())
+            {
+                var worksheet = workbook.Worksheets.Add("PaymentReceives");
+                var currentRow = 1;
+
+                worksheet.Cell(currentRow, 1).Value = "Payment No";
+                worksheet.Cell(currentRow, 2).Value = "Date";
+                worksheet.Cell(currentRow, 3).Value = "Invoice Ref";
+                worksheet.Cell(currentRow, 4).Value = "Customer";
+                worksheet.Cell(currentRow, 5).Value = "Amount";
+                worksheet.Cell(currentRow, 6).Value = "Status";
+
+                var headerRange = worksheet.Range(1, 1, 1, 6);
+                headerRange.Style.Font.Bold = true;
+                headerRange.Style.Fill.BackgroundColor = XLColor.FromHtml("#0D47A1");
+                headerRange.Style.Font.FontColor = XLColor.White;
+
+                foreach (var item in GetFilteredData())
+                {
+                    currentRow++;
+                    worksheet.Cell(currentRow, 1).Value = item.AutoNumber;
+                    worksheet.Cell(currentRow, 2).Value = item.PaymentDate?.ToString("yyyy-MM-dd");
+                    worksheet.Cell(currentRow, 3).Value = item.InvoiceNumber;
+                    worksheet.Cell(currentRow, 4).Value = item.CustomerName;
+                    worksheet.Cell(currentRow, 5).Value = item.PaymentAmount;
+                    worksheet.Cell(currentRow, 6).Value = item.Status.ToString();
+                }
+
+                worksheet.Columns().AdjustToContents();
+
+                using (var stream = new MemoryStream())
+                {
+                    workbook.SaveAs(stream);
+                    var content = Convert.ToBase64String(stream.ToArray());
+                    await JSRuntime.InvokeVoidAsync("downloadFile", "PaymentReceive_List.xlsx", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", content);
+                    Snackbar.Add("Excel exported successfully", Severity.Success);
+                }
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Export failed: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _isExporting = false;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageChanged(int page)
+    {
+        if (page >= 1 && page <= _totalPage)
+        {
+            _skip = (page - 1) * _top;
+            _selectedItem = null;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageSizeChanged(int size)
+    {
+        _top = size;
+        _skip = 0;
+        _selectedItem = null;
+        StateHasChanged();
+    }
+
+    private async Task InvokeEdit()
+    {
+        if (_selectedItem == null) return;
+        var request = await MapToUpdateRequest(_selectedItem.Id!);
+        if (request != null) await OnEdit.InvokeAsync(request);
+    }
+
+    private async Task InvokeView()
+    {
+        if (_selectedItem == null) return;
+        var request = await MapToUpdateRequest(_selectedItem.Id!);
+        if (request != null) await OnView.InvokeAsync(request);
+    }
+
+    private async Task<UpdatePaymentReceiveRequest?> MapToUpdateRequest(string id)
+    {
+        var response = await PaymentReceiveService.GetPaymentReceiveByIdAsync(id);
+        if (response != null && response.IsSuccess && response.Value != null)
+        {
+            var detail = response.Value;
+            return new UpdatePaymentReceiveRequest
+            {
+                Id = detail.Id,
+                InvoiceId = detail.InvoiceId,
+                AutoNumber = detail.AutoNumber,
+                Description = detail.Description,
+                PaymentDate = detail.PaymentDate,
+                PaymentMethodId = detail.PaymentMethodId,
+                PaymentAmount = detail.PaymentAmount,
+                Status = detail.Status,
+                CreatedAt = detail.CreatedAt,
+                CreatedBy = detail.CreatedBy,
+                UpdatedAt = detail.UpdatedAt,
+                UpdatedBy = detail.UpdatedBy
+            };
+        }
+        return null;
+    }
+
+    private async Task OnDelete()
+    {
+        if (_selectedItem == null) return;
+
+        var parameters = new DialogParameters<_DeleteConfirmation> { { x => x.ContentText, _selectedItem.AutoNumber } };
+        var options = new DialogOptions { CloseButton = false, MaxWidth = MaxWidth.ExtraSmall, FullWidth = true };
+
+        var dialog = await DialogService.ShowAsync<_DeleteConfirmation>("", parameters, options);
+        var result = await dialog.Result;
+
+        if (result != null && !result.Canceled)
+        {
+            var isSuccess = await PaymentReceiveService.DeletePaymentReceiveByIdAsync(_selectedItem.Id!);
+            if (isSuccess)
+            {
+                _selectedItem = null;
+                await LoadData();
+                Snackbar.Add("Deleted successfully", Severity.Success);
+            }
+        }
+    }
+}

Features/Sales/PaymentReceive/Components/_PaymentReceiveItemDataTable.razor

@@ -0,0 +1,41 @@
+@using Indotalent.Features.Sales.PaymentReceive.Cqrs
+@using MudBlazor
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; background-color: #ffffff;">
+        <MudText Typo="Typo.button" Color="Color.Default" Style="font-weight: 600; color: #111827;">Referenced Invoice Items</MudText>
+    </div>
+
+    <MudTable Items="Items" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" Dense="true" T="PaymentReceiveItemResponse">
+        <HeaderContent>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">Product</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">UnitPrice</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Quantity</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Total</MudTh>
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd DataLabel="Product">
+                <MudText Typo="Typo.body2" Style="font-weight: 600; color: #374151;">@context.ProductName</MudText>
+                @if (!string.IsNullOrEmpty(context.Summary))
+                {
+                    <MudText Typo="Typo.caption" Color="Color.Secondary">@context.Summary</MudText>
+                }
+            </MudTd>
+            <MudTd DataLabel="UnitPrice" Style="text-align: right;">@context.UnitPrice.ToString("N2")</MudTd>
+            <MudTd DataLabel="Quantity" Style="text-align: right;">@context.Quantity</MudTd>
+            <MudTd DataLabel="Total" Style="text-align: right; font-weight: 700;">@context.Total.ToString("N2")</MudTd>
+        </RowTemplate>
+    </MudTable>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    [Parameter] public List<PaymentReceiveItemResponse> Items { get; set; } = new();
+}

Features/Sales/PaymentReceive/Components/_PaymentReceiveUpdateForm.razor

@@ -0,0 +1,302 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.PaymentReceive.Cqrs
+@using Indotalent.Features.Sales.PaymentReceive.Components
+@using Indotalent.Shared.Utils
+@using MudBlazor
+@using Microsoft.JSInterop
+@inject PaymentReceiveService PaymentReceiveService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #DCEBFA;">
+    <div class="d-flex align-center gap-4">
+        <MudIconButton Icon="@Icons.Material.Filled.ArrowBack" OnClick="() => OnCancel.InvokeAsync()" />
+        <div>
+            <MudText Typo="Typo.h5" Style="font-weight: 900; color: #1a1a1a;">@(ReadOnly ? "Details" : "Edit") Payment Receive</MudText>
+            <MudText Typo="Typo.body2" Style="color: #64748b;">@_model.AutoNumber</MudText>
+        </div>
+    </div>
+    @if (ReadOnly || !string.IsNullOrEmpty(_model.Id))
+    {
+        <MudButton Variant="Variant.Filled"
+                   Color="Color.Info"
+                   StartIcon="@(_isPrinting ? null : Icons.Material.Filled.Print)"
+                   OnClick="DownloadPdf"
+                   Disabled="_isPrinting"
+                   Style="border-radius: 4px; text-transform: none; font-weight: 700; box-shadow: none;">
+            @if (_isPrinting)
+            {
+                <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                <MudText Class="ms-2">Generating Receipt...</MudText>
+            }
+            else
+            {
+                <MudText>Print Receipt</MudText>
+            }
+        </MudButton>
+    }
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 4px; border: 1px solid #DCEBFA;">
+    <MudForm @ref="_form" Model="_model">
+        <MudGrid Spacing="3">
+            <MudItem xs="12"><MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Basic Information</MudText><MudDivider /></MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Payment Date</MudText>
+                <MudDatePicker @bind-Date="_model.PaymentDate" ReadOnly="ReadOnly"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Invoice Reference</MudText>
+                <MudSelect T="string" Value="_model.InvoiceId"
+                           ValueChanged="OnInvoiceChanged"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Invoices)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Payment Method</MudText>
+                <MudSelect T="string" @bind-Value="_model.PaymentMethodId"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.PaymentMethods)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Status</MudText>
+                <MudSelect T="Indotalent.Data.Enums.PaymentReceiveStatus" @bind-Value="_model.Status"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Statuses)
+                    {
+                        <MudSelectItem Value="@((Indotalent.Data.Enums.PaymentReceiveStatus)item.Value)">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Payment Amount</MudText>
+                <MudNumericField @bind-Value="_model.PaymentAmount"
+                                 ReadOnly="ReadOnly"
+                                 Format="N2"
+                                 Variant="Variant.Outlined" Margin="Margin.Dense" FullWidth="true" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Customer</MudText>
+                <MudTextField Value="@_customerName" ReadOnly="true"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" FullWidth="true" Style="background-color: #f1f5f9;" />
+            </MudItem>
+
+            <MudItem xs="12">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
+                <MudTextField @bind-Value="_model.Description"
+                              ReadOnly="ReadOnly"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-6">
+                <_PaymentReceiveItemDataTable Items="_items" />
+            </MudItem>
+
+            <MudItem xs="12" sm="7"></MudItem>
+            <MudItem xs="12" sm="5">
+                <MudPaper Elevation="0" Outlined="true" Class="pa-4" Style="border-radius: 4px; background-color: #F8FAFC; border: 1px solid #DCEBFA;">
+                    <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;" Class="mb-4 d-block">Invoice Commercial Summary</MudText>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Sub Total</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_invoiceSubTotal.ToString("N2")</MudText>
+                    </div>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Tax Amount</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_invoiceTax.ToString("N2")</MudText>
+                    </div>
+                    <MudDivider Class="my-2" />
+                    <div class="d-flex justify-space-between">
+                        <MudText Typo="Typo.subtitle1" Style="font-weight: 900;">Grand Total</MudText>
+                        <MudText Typo="Typo.subtitle1" Color="Color.Primary" Style="font-weight: 900;">@_invoiceGrandTotal.ToString("N2")</MudText>
+                    </div>
+                </MudPaper>
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-4">
+                <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Audit History</MudText>
+                <MudDivider Class="mt-2 mb-4" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Created At</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@DateTimeExtensions.ToString(_model.CreatedAt)</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Created By</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@(!string.IsNullOrEmpty(_model.CreatedBy) ? _model.CreatedBy : "System")</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Last Updated At</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@DateTimeExtensions.ToString(_model.UpdatedAt)</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Last Updated By</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@(!string.IsNullOrEmpty(_model.UpdatedBy) ? _model.UpdatedBy : "System")</MudText>
+            </MudItem>
+        </MudGrid>
+
+        <div class="d-flex justify-end gap-2 mt-10">
+            <MudButton OnClick="() => OnCancel.InvokeAsync()"
+                       Variant="Variant.Outlined"
+                       Disabled="_processing"
+                       Style="border-radius: 4px; text-transform: none; font-weight: 700;border: 1px solid #e0e0e0;">
+                @(ReadOnly ? "Back to List" : "Cancel")
+            </MudButton>
+            @if (!ReadOnly)
+            {
+                <MudButton Color="Color.Primary"
+                           Variant="Variant.Filled"
+                           OnClick="Submit"
+                           Disabled="_processing"
+                           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>Save Changes</MudText>
+                    }
+                </MudButton>
+            }
+        </div>
+    </MudForm>
+</MudPaper>
+
+@code {
+    [Parameter] public UpdatePaymentReceiveRequest Data { get; set; } = new();
+    [Parameter] public bool ReadOnly { get; set; } = false;
+    [Parameter] public EventCallback OnCancel { get; set; }
+    [Parameter] public EventCallback OnSuccess { get; set; }
+
+    private MudForm _form = default!;
+    private UpdatePaymentReceiveRequest _model = new();
+    private List<PaymentReceiveItemResponse> _items = new();
+    private PaymentReceiveLookupResponse _lookup = new();
+    
+    private string _customerName = "";
+    private decimal _invoiceSubTotal = 0;
+    private decimal _invoiceTax = 0;
+    private decimal _invoiceGrandTotal = 0;
+    
+    private bool _processing = false;
+    private bool _isPrinting = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var resLookup = await PaymentReceiveService.GetPaymentReceiveLookupAsync();
+        if (resLookup != null && resLookup.IsSuccess) _lookup = resLookup.Value ?? new();
+
+        _model = Data;
+        await LoadInvoiceDetails(_model.InvoiceId ?? "");
+    }
+
+    private async Task OnInvoiceChanged(string invoiceId)
+    {
+        if (ReadOnly || _model.InvoiceId == invoiceId) return;
+        _model.InvoiceId = invoiceId;
+        await LoadInvoiceDetails(invoiceId);
+        Snackbar.Add("Invoice items and amounts updated.", Severity.Info);
+    }
+
+    private async Task LoadInvoiceDetails(string invoiceId)
+    {
+        if (string.IsNullOrEmpty(invoiceId)) return;
+
+        try
+        {
+            var response = await PaymentReceiveService.GetInvoiceDetailForPaymentAsync(invoiceId);
+            await Task.Delay(500);
+            
+            if (response != null && response.IsSuccess && response.Value != null)
+            {
+                _items = response.Value.Items;
+                _customerName = response.Value.CustomerName ?? "";
+                _invoiceSubTotal = response.Value.SalesOrderBeforeTaxAmount;
+                _invoiceTax = response.Value.SalesOrderTaxAmount;
+                _invoiceGrandTotal = response.Value.SalesOrderAfterTaxAmount;
+                
+                if (!ReadOnly)
+                {
+                    _model.PaymentAmount = response.Value.PaymentAmount;
+                }
+                
+                StateHasChanged();
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+    }
+
+    private async Task DownloadPdf()
+    {
+        try
+        {
+            _isPrinting = true;
+            StateHasChanged();
+            await Task.Delay(1000);
+
+            var response = await PaymentReceiveService.GetPaymentReceiveByIdAsync(_model.Id!);
+            if (response != null && response.IsSuccess && response.Value != null)
+            {
+                var pdfBytes = PaymentReceivePdfGenerator.Generate(response.Value);
+                var fileName = $"Receipt_{response.Value.AutoNumber}.pdf";
+                var base64 = Convert.ToBase64String(pdfBytes);
+                await JSRuntime.InvokeVoidAsync("downloadFile", fileName, "application/pdf", base64);
+                Snackbar.Add("Receipt generated successfully.", Severity.Success);
+            }
+        }
+        finally
+        {
+            _isPrinting = false;
+            StateHasChanged();
+        }
+    }
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+
+        _processing = true;
+        try
+        {
+            var response = await PaymentReceiveService.UpdatePaymentReceiveAsync(_model);
+            await Task.Delay(500);
+
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Updated successfully", Severity.Success);
+                await OnSuccess.InvokeAsync();
+            }
+        }
+        finally
+        {
+            _processing = false;
+        }
+    }
+}

Features/Sales/PaymentReceive/Cqrs/CreatePaymentReceiveHandler.cs

@@ -0,0 +1,59 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Infrastructure.Database;
+using MediatR;
+
+namespace Indotalent.Features.Sales.PaymentReceive.Cqrs;
+
+public class CreatePaymentReceiveRequest
+{
+    public string? InvoiceId { get; set; }
+    public string? Description { get; set; }
+    public DateTime? PaymentDate { get; set; }
+    public string? PaymentMethodId { get; set; }
+    public decimal? PaymentAmount { get; set; }
+    public Data.Enums.PaymentReceiveStatus Status { get; set; }
+}
+
+public class CreatePaymentReceiveResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+}
+
+public record CreatePaymentReceiveCommand(CreatePaymentReceiveRequest Data) : IRequest<CreatePaymentReceiveResponse>;
+
+public class CreatePaymentReceiveHandler : IRequestHandler<CreatePaymentReceiveCommand, CreatePaymentReceiveResponse>
+{
+    private readonly AppDbContext _context;
+    public CreatePaymentReceiveHandler(AppDbContext context) => _context = context;
+
+    public async Task<CreatePaymentReceiveResponse> Handle(CreatePaymentReceiveCommand request, CancellationToken cancellationToken)
+    {
+        var entityName = nameof(Data.Entities.PaymentReceive);
+        var autoNo = await _context.GenerateAutoNumberAsync(
+            entityName: entityName,
+            prefixTemplate: $"PAY/{{Year}}/{{Month}}/",
+            ct: cancellationToken
+        );
+
+        var entity = new Data.Entities.PaymentReceive
+        {
+            AutoNumber = autoNo,
+            InvoiceId = request.Data.InvoiceId,
+            Description = request.Data.Description,
+            PaymentDate = request.Data.PaymentDate,
+            PaymentMethodId = request.Data.PaymentMethodId,
+            PaymentAmount = request.Data.PaymentAmount ?? 0,
+            Status = request.Data.Status
+        };
+
+        _context.PaymentReceive.Add(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+
+        return new CreatePaymentReceiveResponse
+        {
+            Id = entity.Id,
+            AutoNumber = entity.AutoNumber
+        };
+    }
+}

Features/Sales/PaymentReceive/Cqrs/CreatePaymentReceiveValidator.cs

@@ -0,0 +1,14 @@
+using FluentValidation;
+
+namespace Indotalent.Features.Sales.PaymentReceive.Cqrs;
+
+public class CreatePaymentReceiveValidator : AbstractValidator<CreatePaymentReceiveRequest>
+{
+    public CreatePaymentReceiveValidator()
+    {
+        RuleFor(x => x.InvoiceId).NotEmpty().WithMessage("Invoice reference is required");
+        RuleFor(x => x.PaymentDate).NotEmpty().WithMessage("Payment date is required");
+        RuleFor(x => x.PaymentMethodId).NotEmpty().WithMessage("Payment method is required");
+        RuleFor(x => x.PaymentAmount).GreaterThan(0).WithMessage("Amount must be greater than 0");
+    }
+}

Features/Sales/PaymentReceive/Cqrs/DeletePaymentReceiveByIdHandler.cs

@@ -0,0 +1,25 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.PaymentReceive.Cqrs;
+
+public record DeletePaymentReceiveByIdCommand(string Id) : IRequest<bool>;
+
+public class DeletePaymentReceiveByIdHandler : IRequestHandler<DeletePaymentReceiveByIdCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public DeletePaymentReceiveByIdHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(DeletePaymentReceiveByIdCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.PaymentReceive
+            .FirstOrDefaultAsync(x => x.Id == request.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        _context.PaymentReceive.Remove(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+        return true;
+    }
+}

Features/Sales/PaymentReceive/Cqrs/GetInvoiceDetailForPaymentHandler.cs

@@ -0,0 +1,52 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.PaymentReceive.Cqrs;
+
+public record GetInvoiceDetailForPaymentQuery(string InvoiceId) : IRequest<GetPaymentReceiveByIdResponse?>;
+
+public class GetInvoiceDetailForPaymentHandler : IRequestHandler<GetInvoiceDetailForPaymentQuery, GetPaymentReceiveByIdResponse?>
+{
+    private readonly AppDbContext _context;
+    public GetInvoiceDetailForPaymentHandler(AppDbContext context) => _context = context;
+
+    public async Task<GetPaymentReceiveByIdResponse?> Handle(GetInvoiceDetailForPaymentQuery request, CancellationToken cancellationToken)
+    {
+        var invoice = await _context.Invoice
+            .AsNoTracking()
+            .Include(x => x.SalesOrder)
+                .ThenInclude(so => so!.Customer)
+            .Include(x => x.SalesOrder)
+                .ThenInclude(so => so!.SalesOrderItemList)
+                    .ThenInclude(si => si.Product)
+            .FirstOrDefaultAsync(x => x.Id == request.InvoiceId, cancellationToken);
+
+        if (invoice == null) return null;
+
+        var salesOrder = invoice.SalesOrder;
+
+        return new GetPaymentReceiveByIdResponse
+        {
+            InvoiceId = invoice.Id,
+            InvoiceNumber = invoice.AutoNumber,
+            CustomerName = salesOrder?.Customer?.Name,
+            CustomerStreet = salesOrder?.Customer?.Street,
+            CustomerCity = salesOrder?.Customer?.City,
+            SalesOrderBeforeTaxAmount = salesOrder?.BeforeTaxAmount ?? 0,
+            SalesOrderTaxAmount = salesOrder?.TaxAmount ?? 0,
+            SalesOrderAfterTaxAmount = salesOrder?.AfterTaxAmount ?? 0,
+            PaymentAmount = salesOrder?.AfterTaxAmount ?? 0,
+            Items = salesOrder?.SalesOrderItemList.Select(x => new PaymentReceiveItemResponse
+            {
+                Id = x.Id,
+                ProductId = x.ProductId,
+                ProductName = x.Product?.Name,
+                Summary = x.Summary,
+                UnitPrice = x.UnitPrice ?? 0,
+                Quantity = x.Quantity ?? 0,
+                Total = x.Total ?? 0
+            }).ToList() ?? new()
+        };
+    }
+}

Features/Sales/PaymentReceive/Cqrs/GetPaymentReceiveByIdHandler.cs

@@ -0,0 +1,116 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.PaymentReceive.Cqrs;
+
+public class PaymentReceiveItemResponse
+{
+    public string? Id { get; set; }
+    public string? ProductId { get; set; }
+    public string? ProductName { get; set; }
+    public string? Summary { get; set; }
+    public decimal UnitPrice { get; set; }
+    public double Quantity { get; set; }
+    public decimal Total { get; set; }
+}
+
+public class GetPaymentReceiveByIdResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+    public string? InvoiceId { get; set; }
+    public string? InvoiceNumber { get; set; }
+    public string? Description { get; set; }
+    public DateTime? PaymentDate { get; set; }
+    public string? PaymentMethodId { get; set; }
+    public string? PaymentMethodName { get; set; }
+    public decimal PaymentAmount { get; set; }
+    public Data.Enums.PaymentReceiveStatus Status { get; set; }
+    public string? CustomerName { get; set; }
+    public string? CustomerStreet { get; set; }
+    public string? CustomerCity { get; set; }
+    public string? CompanyName { get; set; }
+    public string? CompanyStreet { get; set; }
+    public string? CompanyCity { get; set; }
+    public string? CurrencySymbol { get; set; }
+    public decimal SalesOrderBeforeTaxAmount { get; set; }
+    public decimal SalesOrderTaxAmount { get; set; }
+    public decimal SalesOrderAfterTaxAmount { get; set; }
+    public DateTimeOffset? CreatedAt { get; set; }
+    public string? CreatedBy { get; set; }
+    public DateTimeOffset? UpdatedAt { get; set; }
+    public string? UpdatedBy { get; set; }
+    public List<PaymentReceiveItemResponse> Items { get; set; } = new();
+}
+
+public record GetPaymentReceiveByIdQuery(string Id) : IRequest<GetPaymentReceiveByIdResponse?>;
+
+public class GetPaymentReceiveByIdHandler : IRequestHandler<GetPaymentReceiveByIdQuery, GetPaymentReceiveByIdResponse?>
+{
+    private readonly AppDbContext _context;
+    public GetPaymentReceiveByIdHandler(AppDbContext context) => _context = context;
+
+    public async Task<GetPaymentReceiveByIdResponse?> Handle(GetPaymentReceiveByIdQuery request, CancellationToken cancellationToken)
+    {
+        var company = await _context.Company
+            .AsNoTracking()
+            .Include(x => x.Currency)
+            .OrderByDescending(x => x.IsDefault)
+            .FirstOrDefaultAsync(cancellationToken);
+
+        var payment = await _context.PaymentReceive
+            .AsNoTracking()
+            .Include(x => x.Invoice)
+                .ThenInclude(i => i!.SalesOrder)
+                    .ThenInclude(so => so!.Customer)
+            .Include(x => x.Invoice)
+                .ThenInclude(i => i!.SalesOrder)
+                    .ThenInclude(so => so!.SalesOrderItemList)
+                        .ThenInclude(si => si.Product)
+            .Include(x => x.PaymentMethod)
+            .FirstOrDefaultAsync(x => x.Id == request.Id, cancellationToken);
+
+        if (payment == null) return null;
+
+        var salesOrder = payment.Invoice?.SalesOrder;
+
+        return new GetPaymentReceiveByIdResponse
+        {
+            Id = payment.Id,
+            AutoNumber = payment.AutoNumber,
+            InvoiceId = payment.InvoiceId,
+            InvoiceNumber = payment.Invoice?.AutoNumber,
+            Description = payment.Description,
+            PaymentDate = payment.PaymentDate,
+            PaymentMethodId = payment.PaymentMethodId,
+            PaymentMethodName = payment.PaymentMethod?.Name,
+            PaymentAmount = payment.PaymentAmount ?? 0,
+            Status = payment.Status,
+            CustomerName = salesOrder?.Customer?.Name,
+            CustomerStreet = salesOrder?.Customer?.Street,
+            CustomerCity = salesOrder?.Customer?.City,
+            CompanyName = company?.Name,
+            CompanyStreet = company?.StreetAddress,
+            CompanyCity = company?.City,
+            CurrencySymbol = company?.Currency?.Symbol ?? "IDR",
+            SalesOrderBeforeTaxAmount = salesOrder?.BeforeTaxAmount ?? 0,
+            SalesOrderTaxAmount = salesOrder?.TaxAmount ?? 0,
+            SalesOrderAfterTaxAmount = salesOrder?.AfterTaxAmount ?? 0,
+            CreatedAt = payment.CreatedAt,
+            CreatedBy = payment.CreatedBy,
+            UpdatedAt = payment.UpdatedAt,
+            UpdatedBy = payment.UpdatedBy,
+            Items = salesOrder?.SalesOrderItemList.Select(x => new PaymentReceiveItemResponse
+            {
+                Id = x.Id,
+                ProductId = x.ProductId,
+                ProductName = x.Product?.Name,
+                Summary = x.Summary,
+                UnitPrice = x.UnitPrice ?? 0,
+                Quantity = x.Quantity ?? 0,
+                Total = x.Total ?? 0
+            }).ToList() ?? new()
+        };
+    }
+}

Features/Sales/PaymentReceive/Cqrs/GetPaymentReceiveListHandler.cs

@@ -0,0 +1,44 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.PaymentReceive.Cqrs;
+
+public class GetPaymentReceiveListResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+    public DateTime? PaymentDate { get; set; }
+    public string? InvoiceNumber { get; set; }
+    public string? CustomerName { get; set; }
+    public decimal PaymentAmount { get; set; }
+    public Data.Enums.PaymentReceiveStatus Status { get; set; }
+}
+
+public record GetPaymentReceiveListQuery() : IRequest<List<GetPaymentReceiveListResponse>>;
+
+public class GetPaymentReceiveListHandler : IRequestHandler<GetPaymentReceiveListQuery, List<GetPaymentReceiveListResponse>>
+{
+    private readonly AppDbContext _context;
+    public GetPaymentReceiveListHandler(AppDbContext context) => _context = context;
+
+    public async Task<List<GetPaymentReceiveListResponse>> Handle(GetPaymentReceiveListQuery request, CancellationToken cancellationToken)
+    {
+        return await _context.PaymentReceive
+            .AsNoTracking()
+            .Include(x => x.Invoice)
+                .ThenInclude(i => i!.SalesOrder)
+                    .ThenInclude(so => so!.Customer)
+            .OrderByDescending(x => x.CreatedAt)
+            .Select(x => new GetPaymentReceiveListResponse
+            {
+                Id = x.Id,
+                AutoNumber = x.AutoNumber,
+                PaymentDate = x.PaymentDate,
+                InvoiceNumber = x.Invoice!.AutoNumber,
+                CustomerName = x.Invoice!.SalesOrder!.Customer!.Name,
+                PaymentAmount = x.PaymentAmount ?? 0,
+                Status = x.Status
+            }).ToListAsync(cancellationToken);
+    }
+}

Features/Sales/PaymentReceive/Cqrs/GetPaymentReceiveLookupHandler.cs

@@ -0,0 +1,60 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+using Indotalent.Data.Enums;
+using Indotalent.ConfigBackEnd.Extensions;
+
+namespace Indotalent.Features.Sales.PaymentReceive.Cqrs;
+
+public class PaymentReceiveLookupResponse
+{
+    public List<LookupItem> Invoices { get; set; } = new();
+    public List<LookupItem> PaymentMethods { get; set; } = new();
+    public List<LookupStatusItem> Statuses { get; set; } = new();
+}
+
+public class LookupItem
+{
+    public string? Id { get; set; }
+    public string? Name { get; set; }
+}
+
+public class LookupStatusItem
+{
+    public int Value { get; set; }
+    public string? Name { get; set; }
+}
+
+public record GetPaymentReceiveLookupQuery() : IRequest<PaymentReceiveLookupResponse>;
+
+public class GetPaymentReceiveLookupHandler : IRequestHandler<GetPaymentReceiveLookupQuery, PaymentReceiveLookupResponse>
+{
+    private readonly AppDbContext _context;
+    public GetPaymentReceiveLookupHandler(AppDbContext context) => _context = context;
+
+    public async Task<PaymentReceiveLookupResponse> Handle(GetPaymentReceiveLookupQuery request, CancellationToken cancellationToken)
+    {
+        var response = new PaymentReceiveLookupResponse();
+
+        response.Invoices = await _context.Invoice.AsNoTracking()
+            .Where(x => x.InvoiceStatus == InvoiceStatus.Confirmed)
+            .OrderByDescending(x => x.CreatedAt)
+            .Select(x => new LookupItem { Id = x.Id, Name = x.AutoNumber })
+            .ToListAsync(cancellationToken);
+
+        response.PaymentMethods = await _context.PaymentMethod.AsNoTracking()
+            .OrderBy(x => x.Name)
+            .Select(x => new LookupItem { Id = x.Id, Name = x.Name })
+            .ToListAsync(cancellationToken);
+
+        response.Statuses = Enum.GetValues(typeof(PaymentReceiveStatus))
+            .Cast<PaymentReceiveStatus>()
+            .Select(x => new LookupStatusItem
+            {
+                Value = (int)x,
+                Name = x.GetDescription()
+            }).ToList();
+
+        return response;
+    }
+}

Features/Sales/PaymentReceive/Cqrs/UpdatePaymentReceiveHandler.cs

@@ -0,0 +1,47 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.PaymentReceive.Cqrs;
+
+public class UpdatePaymentReceiveRequest
+{
+    public string? Id { get; set; }
+    public string? InvoiceId { get; set; }
+    public string? AutoNumber { get; set; }
+    public string? Description { get; set; }
+    public DateTime? PaymentDate { get; set; }
+    public string? PaymentMethodId { get; set; }
+    public decimal? PaymentAmount { get; set; }
+    public Data.Enums.PaymentReceiveStatus Status { get; set; }
+    public DateTimeOffset? CreatedAt { get; set; }
+    public string? CreatedBy { get; set; }
+    public DateTimeOffset? UpdatedAt { get; set; }
+    public string? UpdatedBy { get; set; }
+}
+
+public record UpdatePaymentReceiveCommand(UpdatePaymentReceiveRequest Data) : IRequest<bool>;
+
+public class UpdatePaymentReceiveHandler : IRequestHandler<UpdatePaymentReceiveCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public UpdatePaymentReceiveHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(UpdatePaymentReceiveCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.PaymentReceive
+            .FirstOrDefaultAsync(x => x.Id == request.Data.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        entity.InvoiceId = request.Data.InvoiceId;
+        entity.Description = request.Data.Description;
+        entity.PaymentDate = request.Data.PaymentDate;
+        entity.PaymentMethodId = request.Data.PaymentMethodId;
+        entity.PaymentAmount = request.Data.PaymentAmount ?? 0;
+        entity.Status = request.Data.Status;
+
+        await _context.SaveChangesAsync(cancellationToken);
+        return true;
+    }
+}

Features/Sales/PaymentReceive/Cqrs/UpdatePaymentReceiveValidator.cs

@@ -0,0 +1,14 @@
+using FluentValidation;
+
+namespace Indotalent.Features.Sales.PaymentReceive.Cqrs;
+
+public class UpdatePaymentReceiveValidator : AbstractValidator<UpdatePaymentReceiveRequest>
+{
+    public UpdatePaymentReceiveValidator()
+    {
+        RuleFor(x => x.Id).NotEmpty();
+        RuleFor(x => x.InvoiceId).NotEmpty().WithMessage("Invoice reference is required");
+        RuleFor(x => x.PaymentDate).NotEmpty().WithMessage("Payment date is required");
+        RuleFor(x => x.PaymentAmount).GreaterThan(0).WithMessage("Amount must be greater than 0");
+    }
+}

Features/Sales/PaymentReceive/PaymentReceiveEndpoint.cs

@@ -0,0 +1,77 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Features.Sales.PaymentReceive.Cqrs;
+using MediatR;
+using Microsoft.AspNetCore.Authentication.JwtBearer;
+
+namespace Indotalent.Features.Sales.PaymentReceive;
+
+public static class PaymentReceiveEndpoint
+{
+    public static void MapPaymentReceiveEndpoints(this IEndpointRouteBuilder app)
+    {
+        var group = app.MapGroup("/payment-receive").WithTags("PaymentReceives")
+            .RequireAuthorization(policy => policy.AddAuthenticationSchemes(JwtBearerDefaults.AuthenticationScheme)
+            .RequireAuthenticatedUser());
+
+        group.MapGet("/", async (IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetPaymentReceiveListQuery());
+            return result.ToApiResponse("Payment receive list retrieved successfully");
+        })
+        .WithName("GetPaymentReceiveList");
+
+        group.MapGet("/{id}", async (string id, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetPaymentReceiveByIdQuery(id));
+            return result.ToApiResponse(result is not null
+                ? "Payment receive detail retrieved successfully"
+                : $"Payment receive with ID {id} not found");
+        })
+        .WithName("GetPaymentReceiveById");
+
+        group.MapGet("/invoice-detail/{invoiceId}", async (string invoiceId, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetInvoiceDetailForPaymentQuery(invoiceId));
+            return result.ToApiResponse(result is not null
+                ? "Invoice detail for payment retrieved successfully"
+                : $"Invoice with ID {invoiceId} not found");
+        })
+        .WithName("GetInvoiceDetailForPayment");
+
+        group.MapGet("/lookup", async (IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetPaymentReceiveLookupQuery());
+            return result.ToApiResponse("Lookup data retrieved successfully");
+        })
+        .WithName("GetPaymentReceiveLookup");
+
+        group.MapPost("/", async (CreatePaymentReceiveRequest request, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new CreatePaymentReceiveCommand(request));
+            return result.ToApiResponse("Payment receive has been created successfully", StatusCodes.Status201Created);
+        })
+        .WithName("CreatePaymentReceive");
+
+        group.MapPost("/update", async (UpdatePaymentReceiveRequest request, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new UpdatePaymentReceiveCommand(request));
+            if (!result)
+            {
+                return ((object?)null).ToApiResponse("Update failed. Payment receive not found.");
+            }
+            return result.ToApiResponse("Payment receive has been updated successfully");
+        })
+        .WithName("UpdatePaymentReceive");
+
+        group.MapPost("/delete/{id}", async (string id, IMediator mediator) =>
+        {
+            var result = await mediator.Send(new DeletePaymentReceiveByIdCommand(id));
+            if (!result)
+            {
+                return ((object?)null).ToApiResponse("Delete failed. Payment receive not found.");
+            }
+            return true.ToApiResponse("Payment receive has been deleted successfully");
+        })
+        .WithName("DeletePaymentReceiveById");
+    }
+}

Features/Sales/PaymentReceive/PaymentReceivePdfGenerator.cs

@@ -0,0 +1,127 @@
+using QuestPDF.Fluent;
+using QuestPDF.Helpers;
+using QuestPDF.Infrastructure;
+using Indotalent.Features.Sales.PaymentReceive.Cqrs;
+
+namespace Indotalent.Features.Sales.PaymentReceive;
+
+public class PaymentReceivePdfGenerator
+{
+    public static byte[] Generate(GetPaymentReceiveByIdResponse data)
+    {
+        QuestPDF.Settings.License = LicenseType.Community;
+
+        var primaryBlue = "#0D47A1";
+        var textSlate = "#64748b";
+
+        return Document.Create(container =>
+        {
+            container.Page(page =>
+            {
+                page.Size(PageSizes.A4);
+                page.Margin(1.5f, Unit.Centimetre);
+                page.PageColor(Colors.White);
+                page.DefaultTextStyle(x => x.FontSize(9).FontFamily(Fonts.Verdana));
+
+                page.Header().Row(row =>
+                {
+                    row.RelativeItem().Column(col =>
+                    {
+                        col.Item().Text("PAYMENT RECEIPT")
+                            .FontSize(20).ExtraBold().FontColor(primaryBlue);
+                        col.Item().Text($"{data.AutoNumber}").FontSize(11).SemiBold();
+                    });
+
+                    row.RelativeItem().AlignRight().Column(col =>
+                    {
+                        col.Item().Text(data.CompanyName).FontSize(11).ExtraBold();
+                        col.Item().Text($"{data.CompanyStreet}").FontColor(textSlate);
+                        col.Item().Text($"{data.CompanyCity}").FontColor(textSlate);
+                    });
+                });
+
+                page.Content().PaddingVertical(20).Column(col =>
+                {
+                    col.Item().Row(row =>
+                    {
+                        row.RelativeItem().Column(c =>
+                        {
+                            c.Item().BorderBottom(1).PaddingBottom(5).Text("RECEIVED FROM").FontSize(8).Bold().FontColor(textSlate);
+                            c.Item().PaddingTop(5).Text(data.CustomerName).Bold();
+                            c.Item().Text(data.CustomerStreet);
+                            c.Item().Text(data.CustomerCity);
+                        });
+
+                        row.ConstantItem(40);
+
+                        row.RelativeItem().Column(c =>
+                        {
+                            c.Item().BorderBottom(1).PaddingBottom(5).Text("PAYMENT DETAILS").FontSize(8).Bold().FontColor(textSlate);
+                            c.Item().PaddingTop(5).Row(r => {
+                                r.RelativeItem().Text("Payment Date");
+                                r.RelativeItem().AlignRight().Text(data.PaymentDate?.ToString("dd MMM yyyy"));
+                            });
+                            c.Item().Row(r => {
+                                r.RelativeItem().Text("Payment Method");
+                                r.RelativeItem().AlignRight().Text(data.PaymentMethodName);
+                            });
+                            c.Item().Row(r => {
+                                r.RelativeItem().Text("Invoice Ref");
+                                r.RelativeItem().AlignRight().Text(data.InvoiceNumber).Bold();
+                            });
+                        });
+                    });
+
+                    col.Item().PaddingTop(20).Table(table =>
+                    {
+                        table.ColumnsDefinition(columns =>
+                        {
+                            columns.ConstantColumn(25);
+                            columns.RelativeColumn(6);
+                            columns.RelativeColumn(3);
+                        });
+
+                        table.Header(header =>
+                        {
+                            header.Cell().Element(HeaderStyle).Text("#");
+                            header.Cell().Element(HeaderStyle).Text("Item Description");
+                            header.Cell().Element(HeaderStyle).AlignRight().Text($"Total ({data.CurrencySymbol})");
+
+                            static IContainer HeaderStyle(IContainer container) => container.DefaultTextStyle(x => x.SemiBold().FontColor(Colors.White)).PaddingVertical(5).PaddingHorizontal(5).Background("#0D47A1");
+                        });
+
+                        var index = 1;
+                        foreach (var item in data.Items)
+                        {
+                            table.Cell().Element(CellStyle).Text($"{index++}");
+                            table.Cell().Element(CellStyle).Column(c => {
+                                c.Item().Text(item.ProductName).Bold();
+                                if (!string.IsNullOrEmpty(item.Summary)) c.Item().Text(item.Summary).FontSize(8).FontColor(textSlate);
+                            });
+                            table.Cell().Element(CellStyle).AlignRight().Text(item.Total.ToString("N2"));
+
+                            static IContainer CellStyle(IContainer container) => container.BorderBottom(1).BorderColor("#E2E8F0").PaddingVertical(8).PaddingHorizontal(5);
+                        }
+                    });
+
+                    col.Item().PaddingTop(10).Row(row =>
+                    {
+                        row.RelativeItem().Column(c => {
+                            c.Item().Text("Description / Notes:").FontSize(8).Bold();
+                            c.Item().Text(string.IsNullOrEmpty(data.Description) ? "-" : data.Description).FontSize(8);
+                        });
+                        row.ConstantItem(200).Column(c =>
+                        {
+                            c.Item().Row(r => { r.RelativeItem().Text("Sub Total"); r.RelativeItem().AlignRight().Text(data.SalesOrderBeforeTaxAmount.ToString("N2")); });
+                            c.Item().Row(r => { r.RelativeItem().Text("Tax Amount"); r.RelativeItem().AlignRight().Text(data.SalesOrderTaxAmount.ToString("N2")); });
+                            c.Item().PaddingTop(5).BorderTop(1).Row(r => { r.RelativeItem().Text($"TOTAL INVOICE").Bold(); r.RelativeItem().AlignRight().Text(data.SalesOrderAfterTaxAmount.ToString("N2")).ExtraBold(); });
+                            c.Item().PaddingTop(5).Background("#F1F5F9").PaddingHorizontal(5).Row(r => { r.RelativeItem().Text($"AMOUNT PAID").Bold().FontColor(primaryBlue); r.RelativeItem().AlignRight().Text(data.PaymentAmount.ToString("N2")).ExtraBold().FontColor(primaryBlue); });
+                        });
+                    });
+                });
+
+                page.Footer().AlignCenter().Text(x => { x.Span("Page ").FontSize(8); x.CurrentPageNumber().FontSize(8); });
+            });
+        }).GeneratePdf();
+    }
+}

Features/Sales/PaymentReceive/PaymentReceiveService.cs

@@ -0,0 +1,71 @@
+using Indotalent.ConfigBackEnd.Interfaces;
+using Indotalent.ConfigFrontEnd.Common;
+using Indotalent.Features.Sales.PaymentReceive.Cqrs;
+using Indotalent.Infrastructure.Authentication.Identity;
+using Indotalent.Shared.Models;
+using Microsoft.AspNetCore.Components;
+using MudBlazor;
+using RestSharp;
+
+namespace Indotalent.Features.Sales.PaymentReceive;
+
+public class PaymentReceiveService : BaseService
+{
+    private readonly RestClient _client;
+
+    public PaymentReceiveService(
+            IHttpClientFactory clientFactory,
+            NavigationManager nav,
+            ISnackbar snackbar,
+            ICurrentUserService currentUserService,
+            TokenProvider tokenProvider)
+            : base(clientFactory, nav, snackbar, currentUserService, tokenProvider)
+    {
+        _client = new RestClient(nav.BaseUri);
+    }
+
+    public async Task<ApiResponse<List<GetPaymentReceiveListResponse>>?> GetPaymentReceiveListAsync()
+    {
+        var request = new RestRequest("api/payment-receive", Method.Get);
+        return await ExecuteWithResponseAsync<List<GetPaymentReceiveListResponse>>(_client, request);
+    }
+
+    public async Task<ApiResponse<GetPaymentReceiveByIdResponse>?> GetPaymentReceiveByIdAsync(string id)
+    {
+        var request = new RestRequest($"api/payment-receive/{id}", Method.Get);
+        return await ExecuteWithResponseAsync<GetPaymentReceiveByIdResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<GetPaymentReceiveByIdResponse>?> GetInvoiceDetailForPaymentAsync(string invoiceId)
+    {
+        var request = new RestRequest($"api/payment-receive/invoice-detail/{invoiceId}", Method.Get);
+        return await ExecuteWithResponseAsync<GetPaymentReceiveByIdResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<PaymentReceiveLookupResponse>?> GetPaymentReceiveLookupAsync()
+    {
+        var request = new RestRequest("api/payment-receive/lookup", Method.Get);
+        return await ExecuteWithResponseAsync<PaymentReceiveLookupResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<CreatePaymentReceiveResponse>?> CreatePaymentReceiveAsync(CreatePaymentReceiveRequest data)
+    {
+        var request = new RestRequest("api/payment-receive", Method.Post);
+        request.AddJsonBody(data);
+        return await ExecuteWithResponseAsync<CreatePaymentReceiveResponse>(_client, request);
+    }
+
+    public async Task<ApiResponse<bool>?> UpdatePaymentReceiveAsync(UpdatePaymentReceiveRequest data)
+    {
+        var request = new RestRequest("api/payment-receive/update", Method.Post);
+        request.AddJsonBody(data);
+        return await ExecuteWithResponseAsync<bool>(_client, request);
+    }
+
+    public async Task<bool> DeletePaymentReceiveByIdAsync(string id)
+    {
+        var request = new RestRequest($"api/payment-receive/delete/{id}", Method.Post);
+        var response = await ExecuteWithResponseAsync<object>(_client, request);
+        return response?.IsSuccess ?? false;
+    }
+}

Features/Sales/PaymentReceiveReport/Components/PaymentReceiveReportPage.razor

@@ -0,0 +1,8 @@
+@page "/sales/payment-receive-report"
+@using Indotalent.Features.Sales.PaymentReceiveReport.Components
+@using MudBlazor
+
+<_PaymentReceiveReportDataTable />
+
+@code {
+}

Features/Sales/PaymentReceiveReport/Components/_PaymentReceiveReportDataTable.razor

@@ -0,0 +1,300 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.PaymentReceiveReport
+@using Indotalent.Features.Sales.PaymentReceiveReport.Cqrs
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using MudBlazor
+@using Features.Root.Shared
+@using ClosedXML.Excel
+@using System.IO
+@inject PaymentReceiveReportService PaymentReceiveReportService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #E5E7EB; border-radius: 12px;">
+    <div>
+        <MudText Typo="Typo.h5" Style="font-weight: 600; color: #111827;">Payment Receive Report</MudText>
+        <MudText Typo="Typo.body2" Style="color: #9CA3AF;">Detailed log of all incoming customer payments and collections.</MudText>
+    </div>
+    <div class="d-flex align-center gap-2">
+        <MudIcon Icon="@Icons.Material.Filled.Home" Size="Size.Small" Color="Color.Default" />
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">Sales</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="font-weight: 600; color: #111827;">Payment Receive Report</MudText>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; overflow: hidden; background-color: #ffffff; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff; min-height: 80px;">
+        <div style="display: flex; align-items: center; gap: 8px;">
+            <MudTextField @bind-Value="_searchString"
+                          Placeholder="Search Customer, Invoice, or Payment..."
+                          Adornment="Adornment.Start"
+                          AdornmentIcon="@Icons.Material.Filled.Search"
+                          IconSize="Size.Small"
+                          Class="mt-0"
+                          Variant="Variant.Outlined"
+                          Margin="Margin.Dense"
+                          Style="background-color: white; width: 280px; border-radius: 8px;"
+                          OnKeyDown="@HandleSearchKeyDown" />
+            <MudButton Variant="Variant.Filled"
+                       Color="Color.Primary"
+                       OnClick="OnSearchClick"
+                       Size="Size.Small"
+                       Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px; box-shadow: none;">
+                Search
+            </MudButton>
+        </div>
+
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Success"
+                       OnClick="ExportToExcel"
+                       Size="Size.Small"
+                       Disabled="_isExporting"
+                       StartIcon="@(_isExporting ? null : Icons.Custom.FileFormats.FileExcel)"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isExporting)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Excel</MudText>
+                }
+            </MudButton>
+
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Primary"
+                       OnClick="LoadData"
+                       Size="Size.Small"
+                       StartIcon="@(_isRefreshing ? null : Icons.Material.Filled.Refresh)"
+                       Disabled="_isRefreshing"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isRefreshing)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Refreshing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Refresh</MudText>
+                }
+            </MudButton>
+        </div>
+    </div>
+
+    <MudTable Items="@GetPagedData()" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" CustomHeader="true" Dense="true" T="GetPaymentReceiveReportListDto" Loading="@_isRefreshing">
+        <HeaderContent>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveReportListDto, object>(x => x.CustomerName!)">Customer</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveReportListDto, object>(x => x.Number!)">Payment Number</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveReportListDto, object>(x => x.PaymentDate!)">Payment Date</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveReportListDto, object>(x => x.InvoiceNumber!)">Invoice</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveReportListDto, object>(x => x.PaymentMethodName!)">Method</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveReportListDto, object>(x => x.PaymentAmount!)">Amount</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetPaymentReceiveReportListDto, object>(x => x.StatusName!)">Status</MudTableSortLabel>
+            </MudTh>
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.CustomerName</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.Number</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.PaymentDate?.ToString("yyyy-MM-dd")</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.InvoiceNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.PaymentMethodName</MudTd>
+            <MudTd Style="text-align: right; font-weight: 700; color: #2e7d32;">@context.PaymentAmount?.ToString("N2")</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">
+                <MudChip T="string" Color="Color.Success" Size="Size.Small" Variant="Variant.Text" Style="font-weight: 600;">@context.StatusName.ToUpper()</MudChip>
+            </MudTd>
+        </RowTemplate>
+    </MudTable>
+
+    <div style="display: flex; justify-content: space-between; align-items: center; padding: 12px 24px; background-color: #F9FAFB; border-top: 1px solid #E5E7EB;">
+        <div style="display: flex; align-items: center; gap: 12px;">
+            <MudText Typo="Typo.caption" Style="font-weight: 500; color: #9CA3AF; font-size: 0.75rem;">Rows per page:</MudText>
+            <MudSelect T="int" Value="@_top" ValueChanged="OnPageSizeChanged" Dense="true" Margin="Margin.Dense" Style="width: 80px; background-color: white; font-size: 12px; font-weight: 600;" Variant="Variant.Outlined" Class="mt-0 custom-select-dense">
+                <MudSelectItem Value="5" />
+                <MudSelectItem Value="10" />
+                <MudSelectItem Value="50" />
+                <MudSelectItem Value="500" />
+                <MudSelectItem Value="1000" />
+            </MudSelect>
+            <MudText Typo="Typo.caption" Style="color: #9CA3AF; margin-left: 12px; font-size: 0.75rem; font-weight: 500;">
+                Showing @(GetFilteredData().Count() == 0 ? 0 : _skip + 1)-@Math.Min(_skip + _top, GetFilteredData().Count()) of @GetFilteredData().Count()
+            </MudText>
+        </div>
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudIconButton Icon="@Icons.Material.Filled.FirstPage" Size="Size.Small" OnClick="@(() => OnPageChanged(1))" Disabled="@(_currentPage == 1)" Style="@(_currentPage == 1 ? "color: #D1D5DB; background: transparent;" : "color: #6B7280; background: white; border: 1px solid #D1D5DB; border-radius: 6px;")" />
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage - 1))" Disabled="@(_currentPage == 1)" Variant="Variant.Text" StartIcon="@Icons.Material.Filled.ChevronLeft" Size="Size.Small" Style="@(_currentPage == 1 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Prev</MudButton>
+            @{
+                var totalPages = _totalPage == 0 ? 1 : _totalPage;
+                var maxVisible = 5;
+                var startPage = Math.Max(1, _currentPage - maxVisible / 2);
+                var endPage = Math.Min(totalPages, startPage + maxVisible - 1);
+                if (endPage - startPage < maxVisible - 1) { startPage = Math.Max(1, endPage - maxVisible + 1); }
+            }
+            @for (int i = startPage; i <= endPage; i++)
+            {
+                var pageNum = i;
+                var isActive = pageNum == _currentPage;
+                <MudButton OnClick="@(() => OnPageChanged(pageNum))"
+                           Variant="Variant.Text" Size="Size.Small"
+                           Style="@(isActive ? "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 600; background: #3B82F6; color: white; border: 1px solid #3B82F6; border-radius: 6px; text-transform: none;" : "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 500; color: #374151; background: white; border: 1px solid #D1D5DB; border-radius: 6px; text-transform: none;")">@pageNum</MudButton>
+            }
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage + 1))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Variant="Variant.Text" EndIcon="@Icons.Material.Filled.ChevronRight" Size="Size.Small" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Next</MudButton>
+            <MudIconButton Icon="@Icons.Material.Filled.LastPage" Size="Size.Small" OnClick="@(() => OnPageChanged(_totalPage))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "color: #D1D5DB; background: transparent;" : "background-color: white; border: 1px solid #D1D5DB; color: #6B7280;")" />
+        </div>
+    </div>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    private List<GetPaymentReceiveReportListDto> _items = new();
+    private string _searchString = "";
+    private bool _isRefreshing = false;
+    private bool _isExporting = false;
+
+    private int _skip = 0;
+    private int _top = 50;
+    private int _totalPage => GetFilteredData().Count() == 0 ? 0 : (int)Math.Ceiling((double)GetFilteredData().Count() / (_top == 0 ? 1 : _top));
+    private int _currentPage => (_top >= GetFilteredData().Count() || _top == 0) ? 1 : (_skip / _top) + 1;
+
+    protected override async Task OnInitializedAsync() => await LoadData();
+
+    private async Task LoadData()
+    {
+        _isRefreshing = true;
+        StateHasChanged();
+        try
+        {
+            var response = await PaymentReceiveReportService.GetPaymentReceiveReportListAsync();
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                _items = response.Value ?? new();
+            }
+        }
+        finally
+        {
+            _isRefreshing = false;
+            StateHasChanged();
+        }
+    }
+
+    private IEnumerable<GetPaymentReceiveReportListDto> GetFilteredData()
+    {
+        if (string.IsNullOrWhiteSpace(_searchString)) return _items;
+        return _items.Where(x =>
+            (x.Number?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.CustomerName?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.InvoiceNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false)
+        );
+    }
+
+    private IEnumerable<GetPaymentReceiveReportListDto> GetPagedData() => GetFilteredData().Skip(_skip).Take(_top);
+
+    private void OnSearchClick()
+    {
+        _skip = 0;
+        StateHasChanged();
+    }
+
+    private void HandleSearchKeyDown(KeyboardEventArgs e)
+    {
+        if (e.Key == "Enter") OnSearchClick();
+    }
+
+    private async Task ExportToExcel()
+    {
+        _isExporting = true;
+        StateHasChanged();
+        try
+        {
+            await Task.Delay(1000);
+            using (var workbook = new XLWorkbook())
+            {
+                var worksheet = workbook.Worksheets.Add("PaymentReports");
+                var currentRow = 1;
+
+                string[] headers = { "Customer", "Payment Number", "Payment Date", "Invoice", "Method", "Amount", "Status" };
+                for (int i = 0; i < headers.Length; i++)
+                {
+                    worksheet.Cell(currentRow, i + 1).Value = headers[i];
+                }
+
+                var headerRange = worksheet.Range(1, 1, 1, headers.Length);
+                headerRange.Style.Font.Bold = true;
+                headerRange.Style.Fill.BackgroundColor = XLColor.FromHtml("#0D47A1");
+                headerRange.Style.Font.FontColor = XLColor.White;
+
+                foreach (var item in GetFilteredData())
+                {
+                    currentRow++;
+                    worksheet.Cell(currentRow, 1).Value = item.CustomerName;
+                    worksheet.Cell(currentRow, 2).Value = item.Number;
+                    worksheet.Cell(currentRow, 3).Value = item.PaymentDate?.ToString("yyyy-MM-dd");
+                    worksheet.Cell(currentRow, 4).Value = item.InvoiceNumber;
+                    worksheet.Cell(currentRow, 5).Value = item.PaymentMethodName;
+                    worksheet.Cell(currentRow, 6).Value = item.PaymentAmount;
+                    worksheet.Cell(currentRow, 7).Value = item.StatusName;
+                }
+
+                worksheet.Columns().AdjustToContents();
+
+                using (var stream = new MemoryStream())
+                {
+                    workbook.SaveAs(stream);
+                    var content = Convert.ToBase64String(stream.ToArray());
+                    await JSRuntime.InvokeVoidAsync("downloadFile", "Payment_Receive_Report.xlsx", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", content);
+                    Snackbar.Add("Excel exported successfully", Severity.Success);
+                }
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Export failed: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _isExporting = false;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageChanged(int page)
+    {
+        if (page >= 1 && page <= _totalPage)
+        {
+            _skip = (page - 1) * _top;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageSizeChanged(int size)
+    {
+        _top = size;
+        _skip = 0;
+        StateHasChanged();
+    }
+}

Features/Sales/PaymentReceiveReport/Cqrs/GetPaymentReceiveReportListHandler.cs

@@ -0,0 +1,56 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.PaymentReceiveReport.Cqrs;
+
+public record GetPaymentReceiveReportListDto
+{
+    public string? Id { get; init; }
+    public string? Number { get; init; }
+    public DateTime? PaymentDate { get; init; }
+    public string? PaymentMethodName { get; init; }
+    public decimal? PaymentAmount { get; init; }
+    public string? StatusName { get; init; }
+    public string? InvoiceNumber { get; init; }
+    public string? CustomerName { get; init; }
+}
+
+public record GetPaymentReceiveReportListQuery() : IRequest<List<GetPaymentReceiveReportListDto>>;
+
+public class GetPaymentReceiveReportListHandler : IRequestHandler<GetPaymentReceiveReportListQuery, List<GetPaymentReceiveReportListDto>>
+{
+    private readonly AppDbContext _context;
+
+    public GetPaymentReceiveReportListHandler(AppDbContext context)
+    {
+        _context = context;
+    }
+
+    public async Task<List<GetPaymentReceiveReportListDto>> Handle(GetPaymentReceiveReportListQuery request, CancellationToken cancellationToken)
+    {
+        var results = await _context.PaymentReceive
+            .AsNoTracking()
+            .Include(x => x.PaymentMethod)
+            .Include(x => x.Invoice)
+                .ThenInclude(x => x!.SalesOrder)
+                    .ThenInclude(x => x!.Customer)
+            .OrderByDescending(x => x.PaymentDate)
+            .Select(x => new GetPaymentReceiveReportListDto
+            {
+                Id = x.Id,
+                Number = x.AutoNumber,
+                PaymentDate = x.PaymentDate,
+                PaymentMethodName = x.PaymentMethod != null ? x.PaymentMethod.Name : string.Empty,
+                PaymentAmount = x.PaymentAmount,
+                StatusName = x.Status.GetDescription(),
+                InvoiceNumber = x.Invoice != null ? x.Invoice.AutoNumber : string.Empty,
+                CustomerName = (x.Invoice != null && x.Invoice.SalesOrder != null && x.Invoice.SalesOrder.Customer != null)
+                                ? x.Invoice.SalesOrder.Customer.Name : string.Empty
+            })
+            .ToListAsync(cancellationToken);
+
+        return results;
+    }
+}

Features/Sales/PaymentReceiveReport/PaymentReceiveReportEndpoint.cs

@@ -0,0 +1,23 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Features.Sales.PaymentReceiveReport.Cqrs;
+using MediatR;
+using Microsoft.AspNetCore.Authentication.JwtBearer;
+
+namespace Indotalent.Features.Sales.PaymentReceiveReport;
+
+public static class PaymentReceiveReportEndpoint
+{
+    public static void MapPaymentReceiveReportEndpoints(this IEndpointRouteBuilder app)
+    {
+        var group = app.MapGroup("/payment-receive-report").WithTags("PaymentReceiveReports")
+            .RequireAuthorization(policy => policy.AddAuthenticationSchemes(JwtBearerDefaults.AuthenticationScheme)
+            .RequireAuthenticatedUser());
+
+        group.MapGet("/", async (IMediator mediator) =>
+        {
+            var result = await mediator.Send(new GetPaymentReceiveReportListQuery());
+            return result.ToApiResponse("Payment receive report list retrieved successfully");
+        })
+        .WithName("GetPaymentReceiveReportList");
+    }
+}

Features/Sales/PaymentReceiveReport/PaymentReceiveReportService.cs

@@ -0,0 +1,32 @@
+using Indotalent.ConfigBackEnd.Interfaces;
+using Indotalent.ConfigFrontEnd.Common;
+using Indotalent.Features.Sales.PaymentReceiveReport.Cqrs;
+using Indotalent.Infrastructure.Authentication.Identity;
+using Indotalent.Shared.Models;
+using Microsoft.AspNetCore.Components;
+using MudBlazor;
+using RestSharp;
+
+namespace Indotalent.Features.Sales.PaymentReceiveReport;
+
+public class PaymentReceiveReportService : BaseService
+{
+    private readonly RestClient _client;
+
+    public PaymentReceiveReportService(
+            IHttpClientFactory clientFactory,
+            NavigationManager nav,
+            ISnackbar snackbar,
+            ICurrentUserService currentUserService,
+            TokenProvider tokenProvider)
+            : base(clientFactory, nav, snackbar, currentUserService, tokenProvider)
+    {
+        _client = new RestClient(nav.BaseUri);
+    }
+
+    public async Task<ApiResponse<List<GetPaymentReceiveReportListDto>>?> GetPaymentReceiveReportListAsync()
+    {
+        var request = new RestRequest("api/payment-receive-report", Method.Get);
+        return await ExecuteWithResponseAsync<List<GetPaymentReceiveReportListDto>>(_client, request);
+    }
+}

Features/Sales/SalesOrder/Components/SalesOrderPage.razor

@@ -0,0 +1,51 @@
+@page "/sales/sales-order"
+@using Indotalent.Features.Sales.SalesOrder.Cqrs
+@using Indotalent.Features.Sales.SalesOrder.Components
+@using MudBlazor
+
+@if (_currentView == ViewMode.Create)
+{
+    <_SalesOrderCreateForm OnCancel="BackToTable" OnSuccess="HandleSuccess" />
+}
+else if (_currentView == ViewMode.Update || _currentView == ViewMode.View)
+{
+    <_SalesOrderUpdateForm Data="_selectedData!"
+                           ReadOnly="@(_currentView == ViewMode.View)"
+                           OnCancel="BackToTable"
+                           OnSuccess="HandleSuccess" />
+}
+else
+{
+    <_SalesOrderDataTable OnAdd="() => ShowCreate()"
+                          OnEdit="(item) => ShowUpdate(item, false)"
+                          OnView="(item) => ShowUpdate(item, true)" />
+}
+
+@code {
+    private enum ViewMode { Table, Create, Update, View }
+    private ViewMode _currentView = ViewMode.Table;
+    private UpdateSalesOrderRequest? _selectedData;
+
+    private void ShowCreate()
+    {
+        _currentView = ViewMode.Create;
+    }
+
+    private void ShowUpdate(UpdateSalesOrderRequest data, bool isReadOnly)
+    {
+        _selectedData = data;
+        _currentView = isReadOnly ? ViewMode.View : ViewMode.Update;
+    }
+
+    private void BackToTable()
+    {
+        _currentView = ViewMode.Table;
+        _selectedData = null;
+    }
+
+    private void HandleSuccess()
+    {
+        _currentView = ViewMode.Table;
+        _selectedData = null;
+    }
+}

Features/Sales/SalesOrder/Components/_SalesOrderCreateForm.razor

@@ -0,0 +1,141 @@
+@using Indotalent.Features.Sales.SalesOrder.Cqrs
+@using Indotalent.Shared.Utils
+@using MudBlazor
+@inject SalesOrderService SalesOrderService
+@inject ISnackbar Snackbar
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #DCEBFA;">
+    <div class="d-flex align-center gap-4">
+        <MudIconButton Icon="@Icons.Material.Filled.ArrowBack" OnClick="() => OnCancel.InvokeAsync()" />
+        <div>
+            <MudText Typo="Typo.h5" Style="font-weight: 900; color: #1a1a1a;">Add Sales Order</MudText>
+            <MudText Typo="Typo.body2" Style="color: #64748b;">Create a new master sales order.</MudText>
+        </div>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 4px; border: 1px solid #DCEBFA;">
+    <MudForm @ref="_form" Model="_model">
+        <MudGrid Spacing="3">
+            <MudItem xs="12"><MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Basic Information</MudText><MudDivider /></MudItem>
+            
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Order Date</MudText>
+                <MudDatePicker @bind-Date="_model.OrderDate"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Customer</MudText>
+                <MudSelect T="string" @bind-Value="_model.CustomerId"
+                           For="@(() => _model.CustomerId)"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Customers)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Status</MudText>
+                <MudSelect T="Indotalent.Data.Enums.SalesOrderStatus" @bind-Value="_model.OrderStatus"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Statuses)
+                    {
+                        <MudSelectItem Value="@((Indotalent.Data.Enums.SalesOrderStatus)item.Value)">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Tax</MudText>
+                <MudSelect T="string" @bind-Value="_model.TaxId"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Taxes)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
+                <MudTextField @bind-Value="_model.Description"
+                              For="@(() => _model.Description)"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" Lines="3" FullWidth="true" />
+            </MudItem>
+        </MudGrid>
+
+        <div class="d-flex justify-end gap-2 mt-8">
+            <MudButton OnClick="() => OnCancel.InvokeAsync()"
+                       Variant="Variant.Outlined"
+                       Disabled="_processing"
+                       Style="border-radius: 4px; text-transform: none; font-weight: 700;border: 1px solid #e0e0e0;">
+                Cancel
+            </MudButton>
+            <MudButton Color="Color.Primary"
+                       Variant="Variant.Filled"
+                       OnClick="Submit"
+                       Disabled="_processing"
+                       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" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText>Create Order</MudText>
+                }
+            </MudButton>
+        </div>
+    </MudForm>
+</MudPaper>
+
+@code {
+    [Parameter] public EventCallback OnCancel { get; set; }
+    [Parameter] public EventCallback OnSuccess { get; set; }
+
+    private MudForm _form = default!;
+    private CreateSalesOrderValidator _validator = new();
+    private CreateSalesOrderRequest _model = new() { OrderDate = DateTime.Today };
+    private SalesOrderLookupResponse _lookup = new();
+    private bool _processing = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var res = await SalesOrderService.GetSalesOrderLookupAsync();
+        if (res != null && res.IsSuccess) _lookup = res.Value ?? new();
+    }
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+
+        _processing = true;
+        try
+        {
+            var response = await SalesOrderService.CreateSalesOrderAsync(_model);
+            await Task.Delay(500);
+
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Created successfully", Severity.Success);
+                await OnSuccess.InvokeAsync();
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _processing = false;
+        }
+    }
+}

Features/Sales/SalesOrder/Components/_SalesOrderDataTable.razor

@@ -0,0 +1,380 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.SalesOrder
+@using Indotalent.Features.Sales.SalesOrder.Cqrs
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using MudBlazor
+@using Features.Root.Shared
+@using ClosedXML.Excel
+@using System.IO
+@inject SalesOrderService SalesOrderService
+@inject IDialogService DialogService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #E5E7EB; border-radius: 12px;">
+    <div>
+        <MudText Typo="Typo.h5" Style="font-weight: 600; color: #111827;">Sales Order</MudText>
+        <MudText Typo="Typo.body2" Style="color: #9CA3AF;">Manage customer orders and fulfillment process.</MudText>
+    </div>
+    <div class="d-flex align-center gap-2">
+        <MudIcon Icon="@Icons.Material.Filled.Home" Size="Size.Small" Color="Color.Default" />
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">Sales</MudText>
+        <MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
+        <MudText Typo="Typo.caption" Style="font-weight: 600; color: #111827;">Sales Order</MudText>
+    </div>
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; overflow: hidden; background-color: #ffffff; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff; min-height: 80px;">
+        <div style="display: flex; align-items: center; gap: 8px;">
+            <MudTextField @bind-Value="_searchString"
+                          Placeholder="Search..."
+                          Adornment="Adornment.Start"
+                          AdornmentIcon="@Icons.Material.Filled.Search"
+                          IconSize="Size.Small"
+                          Class="mt-0"
+                          Variant="Variant.Outlined"
+                          Margin="Margin.Dense"
+                          Style="background-color: white; width: 280px; border-radius: 8px;"
+                          OnKeyDown="@HandleSearchKeyDown" />
+            <MudButton Variant="Variant.Filled"
+                       Color="Color.Primary"
+                       OnClick="OnSearchClick"
+                       Size="Size.Small"
+                       Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px; box-shadow: none;">
+                Search
+            </MudButton>
+        </div>
+
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Success"
+                       OnClick="ExportToExcel"
+                       Size="Size.Small"
+                       Disabled="_isExporting"
+                       StartIcon="@(_isExporting ? null : Icons.Custom.FileFormats.FileExcel)"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isExporting)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Excel</MudText>
+                }
+            </MudButton>
+
+            <MudButton Variant="Variant.Outlined"
+                       Color="Color.Primary"
+                       OnClick="LoadData"
+                       Size="Size.Small"
+                       StartIcon="@(_isRefreshing ? null : Icons.Material.Filled.Refresh)"
+                       Disabled="_isRefreshing"
+                       Style="background: white; font-weight: 500; border-radius: 6px; text-transform: none; height: 34px; border: 1px solid #D1D5DB; color: #6B7280;">
+                @if (_isRefreshing)
+                {
+                    <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                    <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Refreshing...</MudText>
+                }
+                else
+                {
+                    <MudText Typo="Typo.button" Style="text-transform: none !important;">Refresh</MudText>
+                }
+            </MudButton>
+
+            @if (_selectedItem != null)
+            {
+                <MudButton Variant="Variant.Outlined" Color="Color.Info" StartIcon="@Icons.Material.Filled.Visibility" OnClick="InvokeView" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background-color: white; border: 1px solid #D1D5DB; color: #6B7280;">View</MudButton>
+                <MudButton Variant="Variant.Outlined" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Edit" OnClick="InvokeEdit" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background-color: white; border: 1px solid #D1D5DB; color: #6B7280;">Edit</MudButton>
+                <MudButton Variant="Variant.Outlined" Color="Color.Error" StartIcon="@Icons.Material.Filled.Delete" OnClick="OnDelete" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; background: white; border: 1px solid #FCA5A5; color: #EF4444;">Remove</MudButton>
+                <MudIconButton Icon="@Icons.Material.Filled.Close" Size="Size.Small" OnClick="() => _selectedItem = null" />
+            }
+            else
+            {
+                <MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add" OnClick="() => OnAdd.InvokeAsync()" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px; height: 34px;">
+                    Add Sales Order
+                </MudButton>
+            }
+        </div>
+    </div>
+
+    <MudTable Items="@GetPagedData()" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" CustomHeader="true" Dense="true" T="GetSalesOrderListResponse" OnRowClick="@((args) => _selectedItem = args.Item)" Loading="@_isRefreshing">
+        <HeaderContent>
+            <MudTh Style="width: 50px; background-color: #ffffff; border-bottom: 1px solid #E5E7EB;"></MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetSalesOrderListResponse, object>(x => x.AutoNumber!)">No</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetSalesOrderListResponse, object>(x => x.OrderDate!)">Date</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetSalesOrderListResponse, object>(x => x.CustomerName!)">Customer</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetSalesOrderListResponse, object>(x => x.OrderStatus)">Status</MudTableSortLabel>
+            </MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">
+                <MudTableSortLabel SortBy="new Func<GetSalesOrderListResponse, object>(x => x.AfterTaxAmount!)">Total Amount</MudTableSortLabel>
+            </MudTh>
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd>
+                <MudCheckBox T="bool" Value="@(_selectedItem?.Id == context.Id)" Color="Color.Primary" Dense="true" Size="Size.Small" ReadOnly="true" />
+            </MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.AutoNumber</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.OrderDate?.ToString("yyyy-MM-dd")</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">@context.CustomerName</MudTd>
+            <MudTd Style="padding-top: 0.75rem; padding-bottom: 0.75rem; color: #374151; font-size: 0.875rem;">
+                <MudChip T="string" Color="Color.Info" Size="Size.Small" Variant="Variant.Text" Style="font-weight: 600;">@context.OrderStatus.ToString().ToUpper()</MudChip>
+            </MudTd>
+            <MudTd Style="text-align: right; font-weight: 700;">@context.AfterTaxAmount?.ToString("N2")</MudTd>
+        </RowTemplate>
+    </MudTable>
+
+    <div style="display: flex; justify-content: space-between; align-items: center; padding: 12px 24px; background-color: #F9FAFB; border-top: 1px solid #E5E7EB;">
+        <div style="display: flex; align-items: center; gap: 12px;">
+            <MudText Typo="Typo.caption" Style="font-weight: 500; color: #9CA3AF; font-size: 0.75rem;">Rows per page:</MudText>
+            <MudSelect T="int" Value="@_top" ValueChanged="OnPageSizeChanged" Dense="true" Margin="Margin.Dense" Style="width: 80px; background-color: white; font-size: 12px; font-weight: 600;" Variant="Variant.Outlined" Class="mt-0 custom-select-dense">
+                <MudSelectItem Value="5" />
+                <MudSelectItem Value="10" />
+                <MudSelectItem Value="50" />
+                <MudSelectItem Value="500" />
+                <MudSelectItem Value="1000" />
+            </MudSelect>
+            <MudText Typo="Typo.caption" Style="color: #9CA3AF; margin-left: 12px; font-size: 0.75rem; font-weight: 500;">
+                Showing @(GetFilteredData().Count() == 0 ? 0 : _skip + 1)-@Math.Min(_skip + _top, GetFilteredData().Count()) of @GetFilteredData().Count()
+            </MudText>
+        </div>
+        <div style="display: flex; gap: 8px; align-items: center;">
+            <MudIconButton Icon="@Icons.Material.Filled.FirstPage" Size="Size.Small" OnClick="@(() => OnPageChanged(1))" Disabled="@(_currentPage == 1)" Style="@(_currentPage == 1 ? "color: #D1D5DB; background: transparent;" : "color: #6B7280; background: white; border: 1px solid #D1D5DB; border-radius: 6px;")" />
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage - 1))" Disabled="@(_currentPage == 1)" Variant="Variant.Text" StartIcon="@Icons.Material.Filled.ChevronLeft" Size="Size.Small" Style="@(_currentPage == 1 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Prev</MudButton>
+            @{
+                var totalPages = _totalPage == 0 ? 1 : _totalPage;
+                var maxVisible = 5;
+                var startPage = Math.Max(1, _currentPage - maxVisible / 2);
+                var endPage = Math.Min(totalPages, startPage + maxVisible - 1);
+                if (endPage - startPage < maxVisible - 1) { startPage = Math.Max(1, endPage - maxVisible + 1); }
+            }
+            @for (int i = startPage; i <= endPage; i++)
+            {
+                var pageNum = i;
+                var isActive = pageNum == _currentPage;
+                <MudButton OnClick="@(() => OnPageChanged(pageNum))"
+                           Variant="Variant.Text" Size="Size.Small"
+                           Style="@(isActive ? "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 600; background: #3B82F6; color: white; border: 1px solid #3B82F6; border-radius: 6px; text-transform: none;" : "min-width: 34px; padding: 4px 8px; font-size: 0.75rem; font-weight: 500; color: #374151; background: white; border: 1px solid #D1D5DB; border-radius: 6px; text-transform: none;")">@pageNum</MudButton>
+            }
+            <MudButton OnClick="@(() => OnPageChanged(_currentPage + 1))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Variant="Variant.Text" EndIcon="@Icons.Material.Filled.ChevronRight" Size="Size.Small" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "text-transform: none; font-weight: 500; color: #D1D5DB;" : "text-transform: none; font-weight: 500; color: #374151; border: 1px solid #D1D5DB; border-radius: 6px; background: white;")">Next</MudButton>
+            <MudIconButton Icon="@Icons.Material.Filled.LastPage" Size="Size.Small" OnClick="@(() => OnPageChanged(_totalPage))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "color: #D1D5DB; background: transparent;" : "background-color: white; border: 1px solid #D1D5DB; color: #6B7280;")" />
+        </div>
+    </div>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    [Parameter] public EventCallback OnAdd { get; set; }
+    [Parameter] public EventCallback<UpdateSalesOrderRequest> OnEdit { get; set; }
+    [Parameter] public EventCallback<UpdateSalesOrderRequest> OnView { get; set; }
+
+    private List<GetSalesOrderListResponse> _items = new();
+    private GetSalesOrderListResponse? _selectedItem;
+    private string _searchString = "";
+    private bool _isRefreshing = false;
+    private bool _isExporting = false;
+
+    private int _skip = 0;
+    private int _top = 5;
+    private int _totalPage => GetFilteredData().Count() == 0 ? 0 : (int)Math.Ceiling((double)GetFilteredData().Count() / (_top == 0 ? 1 : _top));
+    private int _currentPage => (_top >= GetFilteredData().Count() || _top == 0) ? 1 : (_skip / _top) + 1;
+
+    protected override async Task OnInitializedAsync() => await LoadData();
+
+    private async Task LoadData()
+    {
+        _isRefreshing = true;
+        _selectedItem = null;
+        StateHasChanged();
+        try
+        {
+            var response = await SalesOrderService.GetSalesOrderListAsync();
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                _items = response.Value ?? new();
+            }
+        }
+        finally
+        {
+            _isRefreshing = false;
+            StateHasChanged();
+        }
+    }
+
+    private IEnumerable<GetSalesOrderListResponse> GetFilteredData()
+    {
+        if (string.IsNullOrWhiteSpace(_searchString)) return _items;
+        return _items.Where(x =>
+            (x.AutoNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
+            (x.CustomerName?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false)
+        );
+    }
+
+    private IEnumerable<GetSalesOrderListResponse> GetPagedData() => GetFilteredData().Skip(_skip).Take(_top);
+
+    private void OnSearchClick()
+    {
+        _skip = 0;
+        _selectedItem = null;
+        StateHasChanged();
+    }
+
+    private void HandleSearchKeyDown(KeyboardEventArgs e)
+    {
+        if (e.Key == "Enter") OnSearchClick();
+    }
+
+    private async Task ExportToExcel()
+    {
+        _isExporting = true;
+        StateHasChanged();
+        try
+        {
+            await Task.Delay(1000);
+            using (var workbook = new XLWorkbook())
+            {
+                var worksheet = workbook.Worksheets.Add("SalesOrders");
+                var currentRow = 1;
+
+                worksheet.Cell(currentRow, 1).Value = "Auto Number";
+                worksheet.Cell(currentRow, 2).Value = "Date";
+                worksheet.Cell(currentRow, 3).Value = "Customer";
+                worksheet.Cell(currentRow, 4).Value = "Status";
+                worksheet.Cell(currentRow, 5).Value = "Total Amount";
+
+                var headerRange = worksheet.Range(1, 1, 1, 5);
+                headerRange.Style.Font.Bold = true;
+                headerRange.Style.Fill.BackgroundColor = XLColor.FromHtml("#0D47A1");
+                headerRange.Style.Font.FontColor = XLColor.White;
+
+                foreach (var item in GetFilteredData())
+                {
+                    currentRow++;
+                    worksheet.Cell(currentRow, 1).Value = item.AutoNumber;
+                    worksheet.Cell(currentRow, 2).Value = item.OrderDate?.ToString("yyyy-MM-dd");
+                    worksheet.Cell(currentRow, 3).Value = item.CustomerName;
+                    worksheet.Cell(currentRow, 4).Value = item.OrderStatus.ToString();
+                    worksheet.Cell(currentRow, 5).Value = item.AfterTaxAmount;
+                }
+
+                worksheet.Columns().AdjustToContents();
+
+                using (var stream = new MemoryStream())
+                {
+                    workbook.SaveAs(stream);
+                    var content = Convert.ToBase64String(stream.ToArray());
+                    await JSRuntime.InvokeVoidAsync("downloadFile", "SO_List.xlsx", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", content);
+                    Snackbar.Add("Excel exported successfully", Severity.Success);
+                }
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Export failed: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _isExporting = false;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageChanged(int page)
+    {
+        if (page >= 1 && page <= _totalPage)
+        {
+            _skip = (page - 1) * _top;
+            _selectedItem = null;
+            StateHasChanged();
+        }
+    }
+
+    private void OnPageSizeChanged(int size)
+    {
+        _top = size;
+        _skip = 0;
+        _selectedItem = null;
+        StateHasChanged();
+    }
+
+    private async Task InvokeEdit()
+    {
+        if (_selectedItem == null) return;
+        var request = await MapToUpdateRequest(_selectedItem.Id!);
+        if (request != null) await OnEdit.InvokeAsync(request);
+    }
+
+    private async Task InvokeView()
+    {
+        if (_selectedItem == null) return;
+        var request = await MapToUpdateRequest(_selectedItem.Id!);
+        if (request != null) await OnView.InvokeAsync(request);
+    }
+
+    private async Task<UpdateSalesOrderRequest?> MapToUpdateRequest(string id)
+    {
+        var response = await SalesOrderService.GetSalesOrderByIdAsync(id);
+        if (response != null && response.IsSuccess && response.Value != null)
+        {
+            var detail = response.Value;
+            return new UpdateSalesOrderRequest
+            {
+                Id = detail.Id,
+                OrderDate = detail.OrderDate,
+                OrderStatus = detail.OrderStatus,
+                Description = detail.Description,
+                CustomerId = detail.CustomerId,
+                TaxId = detail.TaxId,
+                CreatedAt = detail.CreatedAt,
+                CreatedBy = detail.CreatedBy,
+                UpdatedAt = detail.UpdatedAt,
+                UpdatedBy = detail.UpdatedBy,
+                AutoNumber = detail.AutoNumber,
+                BeforeTaxAmount = detail.BeforeTaxAmount,
+                TaxAmount = detail.TaxAmount,
+                AfterTaxAmount = detail.AfterTaxAmount
+            };
+        }
+        return null;
+    }
+
+    private async Task OnDelete()
+    {
+        if (_selectedItem == null) return;
+
+        var parameters = new DialogParameters<_DeleteConfirmation> { { x => x.ContentText, _selectedItem.AutoNumber } };
+        var options = new DialogOptions { CloseButton = false, MaxWidth = MaxWidth.ExtraSmall, FullWidth = true };
+
+        var dialog = await DialogService.ShowAsync<_DeleteConfirmation>("", parameters, options);
+        var result = await dialog.Result;
+
+        if (result != null && !result.Canceled)
+        {
+            var isSuccess = await SalesOrderService.DeleteSalesOrderByIdAsync(_selectedItem.Id!);
+            if (isSuccess)
+            {
+                _selectedItem = null;
+                await LoadData();
+                Snackbar.Add("Deleted successfully", Severity.Success);
+            }
+        }
+    }
+}

Features/Sales/SalesOrder/Components/_SalesOrderItemCreateForm.razor

@@ -0,0 +1,86 @@
+@using Indotalent.Features.Sales.SalesOrder.Cqrs
+@using MudBlazor
+@inject SalesOrderService SalesOrderService
+@inject ISnackbar Snackbar
+
+<MudDialog>
+    <DialogContent>
+        <MudForm @ref="_form" Model="_model">
+            <MudGrid Spacing="2">
+                <MudItem xs="12">
+                    <MudText Typo="Typo.subtitle2" Class="mb-0">Product</MudText>
+                    <MudSelect T="string" @bind-Value="_model.ProductId"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true"
+                               AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                        @foreach (var item in _lookup.Products)
+                        {
+                            <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                        }
+                    </MudSelect>
+                </MudItem>
+                <MudItem xs="12" sm="6">
+                    <MudText Typo="Typo.subtitle2" Class="mb-1">Unit Price</MudText>
+                    <MudNumericField @bind-Value="_model.UnitPrice" Variant="Variant.Outlined" Margin="Margin.Dense" />
+                </MudItem>
+                <MudItem xs="12" sm="6">
+                    <MudText Typo="Typo.subtitle2" Class="mb-1">Quantity</MudText>
+                    <MudNumericField @bind-Value="_model.Quantity" Variant="Variant.Outlined" Margin="Margin.Dense" />
+                </MudItem>
+                <MudItem xs="12">
+                    <MudText Typo="Typo.subtitle2" Class="mb-1">Summary</MudText>
+                    <MudTextField @bind-Value="_model.Summary" Variant="Variant.Outlined" Margin="Margin.Dense" />
+                </MudItem>
+            </MudGrid>
+        </MudForm>
+    </DialogContent>
+    <DialogActions>
+        <MudButton OnClick="Cancel" Variant="Variant.Text">Cancel</MudButton>
+        <MudButton Color="Color.Primary" OnClick="Submit" Variant="Variant.Filled" Disabled="_processing" Style="text-transform: none; font-weight: 700; border-radius: 4px;">
+            @if (_processing)
+            {
+                <MudProgressCircular Size="Size.Small" Indeterminate="true" />
+                <MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
+            }
+            else
+            {
+                <MudText>Add Item</MudText>
+            }
+        </MudButton>
+    </DialogActions>
+</MudDialog>
+
+@code {
+    [CascadingParameter] IMudDialogInstance MudDialog { get; set; } = default!;
+    [Parameter] public string SalesOrderId { get; set; } = string.Empty;
+    private MudForm _form = default!;
+    private CreateSalesOrderItemRequest _model = new() { Quantity = 1 };
+    private SalesOrderLookupResponse _lookup = new();
+    private bool _processing = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var res = await SalesOrderService.GetSalesOrderLookupAsync();
+        if (res != null && res.IsSuccess) _lookup = res.Value ?? new();
+        _model.SalesOrderId = SalesOrderId;
+    }
+
+    private void Cancel() => MudDialog.Cancel();
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+        _processing = true;
+        try
+        {
+            var response = await SalesOrderService.CreateSalesOrderItemAsync(_model);
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Item added successfully", Severity.Success);
+                MudDialog.Close(DialogResult.Ok(true));
+            }
+        }
+        finally { _processing = false; }
+    }
+}

Features/Sales/SalesOrder/Components/_SalesOrderItemDataTable.razor

@@ -0,0 +1,95 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.SalesOrder
+@using Indotalent.Features.Sales.SalesOrder.Cqrs
+@using MudBlazor
+@using Indotalent.Features.Root.Shared
+@inject SalesOrderService SalesOrderService
+@inject IDialogService DialogService
+@inject ISnackbar Snackbar
+
+<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; border: 1px solid #E5E7EB;">
+    <div style="padding: 20px 24px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff;">
+        <MudText Typo="Typo.button" Color="Color.Default" Style="font-weight: 600; color: #111827;">Order Items</MudText>
+        @if (!ReadOnly)
+        {
+            <MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add" OnClick="OnAddClick" Size="Size.Small" Style="text-transform: none; font-weight: 500; border-radius: 6px;">
+                Add Item
+            </MudButton>
+        }
+    </div>
+
+    <MudTable Items="Items" Striped="true" Class="mud-table-styled" Hover="true" Elevation="0" Dense="true" T="SalesOrderItemResponse">
+        <HeaderContent>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB;">Product</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Unit Price</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Quantity</MudTh>
+            <MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.05em; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; text-align: right;">Total</MudTh>
+            @if (!ReadOnly)
+            {
+                <MudTh Style="width: 100px; text-align: right; font-weight: 600; color: #6B7280;">Actions</MudTh>
+            }
+        </HeaderContent>
+        <RowTemplate>
+            <MudTd DataLabel="Product">@context.ProductName</MudTd>
+            <MudTd DataLabel="UnitPrice" Style="text-align: right;">@context.UnitPrice?.ToString("N2")</MudTd>
+            <MudTd DataLabel="Quantity" Style="text-align: right;">@context.Quantity</MudTd>
+            <MudTd DataLabel="Total" Style="text-align: right; font-weight: 700;">@context.Total?.ToString("N2")</MudTd>
+            @if (!ReadOnly)
+            {
+                <MudTd Style="text-align: right;">
+                    <MudIconButton Icon="@Icons.Material.Filled.Edit" Size="Size.Small" Color="Color.Primary" OnClick="@(() => OnEditClick(context))" />
+                    <MudIconButton Icon="@Icons.Material.Filled.Delete" Size="Size.Small" Color="Color.Error" OnClick="@(() => OnDeleteClick(context))" />
+                </MudTd>
+            }
+        </RowTemplate>
+    </MudTable>
+</MudPaper>
+
+
+<style>
+    .mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
+    .mud-input-outlined-border { border-radius: 8px !important; }
+    .custom-select-dense .mud-input-control { margin-top: 0 !important; }
+    .custom-select-dense .mud-input-slot { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 8px !important; font-size: 12px !important; }
+</style>
+
+@code {
+    [Parameter] public string SalesOrderId { get; set; } = string.Empty;
+    [Parameter] public List<SalesOrderItemResponse> Items { get; set; } = new();
+    [Parameter] public bool ReadOnly { get; set; } = false;
+    [Parameter] public EventCallback OnChanged { get; set; }
+
+    private async Task OnAddClick()
+    {
+        var parameters = new DialogParameters { ["SalesOrderId"] = SalesOrderId };
+        var options = new DialogOptions { MaxWidth = MaxWidth.Small, FullWidth = true, CloseButton = true };
+        var dialog = await DialogService.ShowAsync<_SalesOrderItemCreateForm>("Add Item", parameters, options);
+        var result = await dialog.Result;
+        if (result != null && !result.Canceled) await OnChanged.InvokeAsync();
+    }
+
+    private async Task OnEditClick(SalesOrderItemResponse item)
+    {
+        var parameters = new DialogParameters { ["Data"] = item };
+        var options = new DialogOptions { MaxWidth = MaxWidth.Small, FullWidth = true, CloseButton = true };
+        var dialog = await DialogService.ShowAsync<_SalesOrderItemUpdateForm>("Edit Item", parameters, options);
+        var result = await dialog.Result;
+        if (result != null && !result.Canceled) await OnChanged.InvokeAsync();
+    }
+
+    private async Task OnDeleteClick(SalesOrderItemResponse item)
+    {
+        var parameters = new DialogParameters { ["ContentText"] = $"Are you sure you want to remove this item?" };
+        var dialog = await DialogService.ShowAsync<_DeleteConfirmation>("Delete Confirmation", parameters, new DialogOptions { MaxWidth = MaxWidth.ExtraSmall, FullWidth = true });
+        var result = await dialog.Result;
+        if (result != null && !result.Canceled)
+        {
+            var success = await SalesOrderService.DeleteSalesOrderItemAsync(item.Id!);
+            if (success)
+            {
+                Snackbar.Add("Removed successfully", Severity.Success);
+                await OnChanged.InvokeAsync();
+            }
+        }
+    }
+}

Features/Sales/SalesOrder/Components/_SalesOrderItemUpdateForm.razor

@@ -0,0 +1,96 @@
+@using Indotalent.Features.Sales.SalesOrder.Cqrs
+@using MudBlazor
+@inject SalesOrderService SalesOrderService
+@inject ISnackbar Snackbar
+
+<MudDialog>
+    <DialogContent>
+        <MudForm @ref="_form" Model="_model">
+            <MudGrid Spacing="2">
+                <MudItem xs="12">
+                    <MudText Typo="Typo.subtitle2" Class="mb-0">Product</MudText>
+                    <MudSelect T="string" @bind-Value="_model.ProductId"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true"
+                               AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                        @foreach (var item in _lookup.Products)
+                        {
+                            <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                        }
+                    </MudSelect>
+                </MudItem>
+                <MudItem xs="12" sm="6">
+                    <MudText Typo="Typo.subtitle2" Class="mb-1">Unit Price</MudText>
+                    <MudNumericField @bind-Value="_model.UnitPrice" Variant="Variant.Outlined" Margin="Margin.Dense" />
+                </MudItem>
+                <MudItem xs="12" sm="6">
+                    <MudText Typo="Typo.subtitle2" Class="mb-1">Quantity</MudText>
+                    <MudNumericField @bind-Value="_model.Quantity" Variant="Variant.Outlined" Margin="Margin.Dense" />
+                </MudItem>
+                <MudItem xs="12">
+                    <MudText Typo="Typo.subtitle2" Class="mb-1">Summary</MudText>
+                    <MudTextField @bind-Value="_model.Summary" Variant="Variant.Outlined" Margin="Margin.Dense" />
+                </MudItem>
+            </MudGrid>
+        </MudForm>
+    </DialogContent>
+    <DialogActions>
+        <MudButton OnClick="Cancel" Variant="Variant.Text">Cancel</MudButton>
+        <MudButton Color="Color.Primary" OnClick="Submit" Variant="Variant.Filled" Disabled="_processing" Style="text-transform: none; font-weight: 700; border-radius: 4px;">
+            @if (_processing)
+            {
+                <MudProgressCircular Size="Size.Small" Indeterminate="true" />
+                <MudText Class="ms-2">Updating...</MudText>
+            }
+            else
+            {
+                <MudText>Save Changes</MudText>
+            }
+        </MudButton>
+    </DialogActions>
+</MudDialog>
+
+@code {
+    [CascadingParameter] IMudDialogInstance MudDialog { get; set; } = default!;
+    [Parameter] public SalesOrderItemResponse Data { get; set; } = new();
+    private MudForm _form = default!;
+    private UpdateSalesOrderItemRequest _model = new();
+    private SalesOrderLookupResponse _lookup = new();
+    private bool _processing = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var res = await SalesOrderService.GetSalesOrderLookupAsync();
+        if (res != null && res.IsSuccess)
+        {
+            _lookup = res.Value ?? new();
+        }
+
+        _model.Id = Data.Id;
+        _model.ProductId = Data.ProductId;
+        _model.Summary = Data.Summary;
+        _model.UnitPrice = Data.UnitPrice;
+        _model.Quantity = Data.Quantity;
+
+        StateHasChanged();
+    }
+
+    private void Cancel() => MudDialog.Cancel();
+
+    private async Task Submit()
+    {
+        await _form.Validate();
+        if (!_form.IsValid) return;
+        _processing = true;
+        try
+        {
+            var response = await SalesOrderService.UpdateSalesOrderItemAsync(_model);
+            await Task.Delay(500);
+            if (response != null && response.IsSuccess)
+            {
+                Snackbar.Add("Item updated successfully", Severity.Success);
+                MudDialog.Close(DialogResult.Ok(true));
+            }
+        }
+        finally { _processing = false; }
+    }
+}

Features/Sales/SalesOrder/Components/_SalesOrderUpdateForm.razor

@@ -0,0 +1,300 @@
+@using Indotalent.ConfigBackEnd.Extensions
+@using Indotalent.Features.Sales.SalesOrder.Cqrs
+@using Indotalent.Features.Sales.SalesOrder.Components
+@using Indotalent.Shared.Utils
+@using MudBlazor
+@using Microsoft.JSInterop
+@inject SalesOrderService SalesOrderService
+@inject ISnackbar Snackbar
+@inject IJSRuntime JSRuntime
+
+<MudPaper Elevation="0" Square="true" Class="pa-6 mb-3 d-flex align-center justify-space-between" Style="border: 1px solid #DCEBFA;">
+    <div class="d-flex align-center gap-4">
+        <MudIconButton Icon="@Icons.Material.Filled.ArrowBack" OnClick="() => OnCancel.InvokeAsync()" />
+        <div>
+            <MudText Typo="Typo.h5" Style="font-weight: 900; color: #1a1a1a;">@(ReadOnly ? "Details" : "Edit") Order</MudText>
+            <MudText Typo="Typo.body2" Style="color: #64748b;">@_model.AutoNumber</MudText>
+        </div>
+    </div>
+    @if (ReadOnly || !string.IsNullOrEmpty(_model.Id))
+    {
+        <MudButton Variant="Variant.Filled"
+                   Color="Color.Info"
+                   StartIcon="@(_isPrinting ? null : Icons.Material.Filled.Print)"
+                   OnClick="DownloadPdf"
+                   Disabled="_isPrinting"
+                   Style="border-radius: 4px; text-transform: none; font-weight: 700; box-shadow: none;">
+            @if (_isPrinting)
+            {
+                <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
+                <MudText Class="ms-2">Generating PDF...</MudText>
+            }
+            else
+            {
+                <MudText>Print PDF</MudText>
+            }
+        </MudButton>
+    }
+</MudPaper>
+
+<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 4px; border: 1px solid #DCEBFA;">
+    <MudForm @ref="_form" Model="_model">
+        <MudGrid Spacing="3">
+            <MudItem xs="12"><MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Basic Information</MudText><MudDivider /></MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Order Date</MudText>
+                <MudDatePicker @bind-Date="_model.OrderDate" ReadOnly="ReadOnly"
+                               Variant="Variant.Outlined" Margin="Margin.Dense" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Customer</MudText>
+                <MudSelect T="string" @bind-Value="_model.CustomerId"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Customers)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Status</MudText>
+                <MudSelect T="Indotalent.Data.Enums.SalesOrderStatus" @bind-Value="_model.OrderStatus"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Statuses)
+                    {
+                        <MudSelectItem Value="@((Indotalent.Data.Enums.SalesOrderStatus)item.Value)">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2" Class="mb-0">Tax</MudText>
+                <MudSelect T="string" Value="_model.TaxId"
+                           ValueChanged="OnTaxChanged"
+                           ReadOnly="ReadOnly"
+                           Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true"
+                           AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
+                    @foreach (var item in _lookup.Taxes)
+                    {
+                        <MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
+                    }
+                </MudSelect>
+            </MudItem>
+
+            <MudItem xs="12">
+                <MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
+                <MudTextField @bind-Value="_model.Description"
+                              ReadOnly="ReadOnly"
+                              Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-6">
+                <_SalesOrderItemDataTable Items="_items" SalesOrderId="@(_model.Id ?? string.Empty)" ReadOnly="ReadOnly" OnChanged="RefreshItems" />
+            </MudItem>
+
+            <MudItem xs="12" sm="7"></MudItem>
+            <MudItem xs="12" sm="5">
+                <MudPaper Elevation="0" Outlined="true" Class="pa-4" Style="border-radius: 4px; background-color: #F8FAFC; border: 1px solid #DCEBFA;">
+                    <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;" Class="mb-4 d-block">Order Summary</MudText>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Sub Total</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_model.BeforeTaxAmount?.ToString("N2")</MudText>
+                    </div>
+                    <div class="d-flex justify-space-between mb-2">
+                        <MudText Typo="Typo.body2">Tax Amount</MudText>
+                        <MudText Typo="Typo.body2" Style="font-weight: 700;">@_model.TaxAmount?.ToString("N2")</MudText>
+                    </div>
+                    <MudDivider Class="my-2" />
+                    <div class="d-flex justify-space-between">
+                        <MudText Typo="Typo.subtitle1" Style="font-weight: 900;">Total Amount</MudText>
+                        <MudText Typo="Typo.subtitle1" Color="Color.Primary" Style="font-weight: 900;">@_model.AfterTaxAmount?.ToString("N2")</MudText>
+                    </div>
+                </MudPaper>
+            </MudItem>
+
+            <MudItem xs="12" Class="mt-4">
+                <MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 800;">Audit History</MudText>
+                <MudDivider Class="mt-2 mb-4" />
+            </MudItem>
+
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Created At</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@DateTimeExtensions.ToString(_model.CreatedAt)</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Created By</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@(!string.IsNullOrEmpty(_model.CreatedBy) ? _model.CreatedBy : "System")</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Last Updated At</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@DateTimeExtensions.ToString(_model.UpdatedAt)</MudText>
+            </MudItem>
+            <MudItem xs="12" sm="6">
+                <MudText Typo="Typo.subtitle2">Last Updated By</MudText>
+                <MudText Typo="Typo.body2" Style="color: #1a1a1a; font-weight: 600;">@(!string.IsNullOrEmpty(_model.UpdatedBy) ? _model.UpdatedBy : "System")</MudText>
+            </MudItem>
+        </MudGrid>
+
+        <div class="d-flex justify-end gap-2 mt-10">
+            <MudButton OnClick="() => OnCancel.InvokeAsync()"
+                       Variant="Variant.Outlined"
+                       Disabled="_processing"
+                       Style="border-radius: 4px; text-transform: none; font-weight: 700;border: 1px solid #e0e0e0;">
+                @(ReadOnly ? "Back to List" : "Cancel")
+            </MudButton>
+            @if (!ReadOnly)
+            {
+                <MudButton Color="Color.Primary"
+                           Variant="Variant.Filled"
+                           OnClick="Submit"
+                           Disabled="_processing"
+                           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>Save Changes</MudText>
+                    }
+                </MudButton>
+            }
+        </div>
+    </MudForm>
+</MudPaper>
+
+@code {
+    [Parameter] public UpdateSalesOrderRequest Data { get; set; } = new();
+    [Parameter] public bool ReadOnly { get; set; } = false;
+    [Parameter] public EventCallback OnCancel { get; set; }
+    [Parameter] public EventCallback OnSuccess { get; set; }
+
+    private MudForm _form = default!;
+    private UpdateSalesOrderValidator _validator = new();
+    private UpdateSalesOrderRequest _model = new();
+    private List<SalesOrderItemResponse> _items = new();
+    private SalesOrderLookupResponse _lookup = new();
+    private bool _processing = false;
+    private bool _isPrinting = false;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var resLookup = await SalesOrderService.GetSalesOrderLookupAsync();
+        if (resLookup != null && resLookup.IsSuccess) _lookup = resLookup.Value ?? new();
+
+        _model = Data;
+        await RefreshItems();
+    }
+
+    private async Task OnTaxChanged(string newTaxId)
+    {
+        if (ReadOnly || _model.TaxId == newTaxId) return;
+        
+        _model.TaxId = newTaxId;
+        StateHasChanged();
+
+        await SubmitInternal(false);
+        Snackbar.Add("Tax updated and totals recalculated.", Severity.Info);
+        await RefreshItems();
+    }
+
+    private async Task RefreshItems()
+    {
+        try
+        {
+            var response = await SalesOrderService.GetSalesOrderByIdAsync(_model.Id!);
+            await Task.Delay(500);
+            
+            if (response != null && response.IsSuccess && response.Value != null)
+            {
+                _items = response.Value.Items ?? new();
+                _model.BeforeTaxAmount = response.Value.BeforeTaxAmount;
+                _model.TaxAmount = response.Value.TaxAmount;
+                _model.AfterTaxAmount = response.Value.AfterTaxAmount;
+                StateHasChanged();
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+    }
+
+    private async Task DownloadPdf()
+    {
+        try
+        {
+            _isPrinting = true;
+            StateHasChanged();
+
+            await Task.Delay(1000);
+
+            var response = await SalesOrderService.GetSalesOrderByIdAsync(_model.Id!);
+            if (response != null && response.IsSuccess && response.Value != null)
+            {
+                var pdfBytes = SalesOrderPdfGenerator.Generate(response.Value);
+                var fileName = $"SO_{response.Value.AutoNumber}.pdf";
+                var base64 = Convert.ToBase64String(pdfBytes);
+                await JSRuntime.InvokeVoidAsync("downloadFile", fileName, "application/pdf", base64);
+                Snackbar.Add("PDF generated successfully.", Severity.Success);
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _isPrinting = false;
+            StateHasChanged();
+        }
+    }
+
+    private async Task Submit()
+    {
+        await SubmitInternal(true);
+    }
+
+    private async Task SubmitInternal(bool showNotification)
+    {
+        if (ReadOnly) return;
+        
+        await _form.Validate();
+        if (!_form.IsValid) return;
+
+        _processing = true;
+        StateHasChanged();
+        
+        try
+        {
+            var response = await SalesOrderService.UpdateSalesOrderAsync(_model);
+            await Task.Delay(500);
+
+            if (response != null && response.IsSuccess)
+            {
+                if (showNotification)
+                {
+                    Snackbar.Add("Updated successfully", Severity.Success);
+                    await OnSuccess.InvokeAsync();
+                }
+            }
+        }
+        catch (Exception ex)
+        {
+            Snackbar.Add($"Error: {ex.Message}", Severity.Error);
+        }
+        finally
+        {
+            _processing = false;
+            StateHasChanged();
+        }
+    }
+}

Features/Sales/SalesOrder/Cqrs/CreateSalesOrderHandler.cs

@@ -0,0 +1,60 @@
+using Indotalent.ConfigBackEnd.Extensions;
+using Indotalent.Infrastructure.Database;
+using MediatR;
+
+namespace Indotalent.Features.Sales.SalesOrder.Cqrs;
+
+public class CreateSalesOrderRequest
+{
+    public DateTime? OrderDate { get; set; }
+    public Data.Enums.SalesOrderStatus OrderStatus { get; set; }
+    public string? Description { get; set; }
+    public string? CustomerId { get; set; }
+    public string? TaxId { get; set; }
+}
+
+public class CreateSalesOrderResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+}
+
+public record CreateSalesOrderCommand(CreateSalesOrderRequest Data) : IRequest<CreateSalesOrderResponse>;
+
+public class CreateSalesOrderHandler : IRequestHandler<CreateSalesOrderCommand, CreateSalesOrderResponse>
+{
+    private readonly AppDbContext _context;
+    public CreateSalesOrderHandler(AppDbContext context) => _context = context;
+
+    public async Task<CreateSalesOrderResponse> Handle(CreateSalesOrderCommand request, CancellationToken cancellationToken)
+    {
+        var entityName = nameof(Data.Entities.SalesOrder);
+        var autoNo = await _context.GenerateAutoNumberAsync(
+            entityName: entityName,
+            prefixTemplate: $"SO/{{Year}}/{{Month}}/",
+            ct: cancellationToken
+        );
+
+        var entity = new Data.Entities.SalesOrder
+        {
+            AutoNumber = autoNo,
+            OrderDate = request.Data.OrderDate,
+            OrderStatus = request.Data.OrderStatus,
+            Description = request.Data.Description,
+            CustomerId = request.Data.CustomerId,
+            TaxId = request.Data.TaxId,
+            BeforeTaxAmount = 0,
+            TaxAmount = 0,
+            AfterTaxAmount = 0
+        };
+
+        _context.SalesOrder.Add(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+
+        return new CreateSalesOrderResponse
+        {
+            Id = entity.Id,
+            AutoNumber = entity.AutoNumber
+        };
+    }
+}

Features/Sales/SalesOrder/Cqrs/CreateSalesOrderItemHandler.cs

@@ -0,0 +1,45 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Indotalent.Shared.Utils;
+
+namespace Indotalent.Features.Sales.SalesOrder.Cqrs;
+
+public class CreateSalesOrderItemRequest
+{
+    public string? SalesOrderId { get; set; }
+    public string? ProductId { get; set; }
+    public string? Summary { get; set; }
+    public decimal? UnitPrice { get; set; }
+    public double? Quantity { get; set; }
+}
+
+public record CreateSalesOrderItemCommand(CreateSalesOrderItemRequest Data) : IRequest<bool>;
+
+public class CreateSalesOrderItemHandler : IRequestHandler<CreateSalesOrderItemCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public CreateSalesOrderItemHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(CreateSalesOrderItemCommand request, CancellationToken cancellationToken)
+    {
+        var entity = new Data.Entities.SalesOrderItem
+        {
+            SalesOrderId = request.Data.SalesOrderId,
+            ProductId = request.Data.ProductId,
+            Summary = request.Data.Summary,
+            UnitPrice = request.Data.UnitPrice ?? 0,
+            Quantity = request.Data.Quantity ?? 0,
+            Total = (request.Data.UnitPrice ?? 0) * (decimal)(request.Data.Quantity ?? 0)
+        };
+
+        _context.SalesOrderItem.Add(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+
+        if (!string.IsNullOrEmpty(request.Data.SalesOrderId))
+        {
+            SalesOrderHelper.Recalculate(_context, request.Data.SalesOrderId);
+        }
+
+        return true;
+    }
+}

Features/Sales/SalesOrder/Cqrs/CreateSalesOrderValidator.cs

@@ -0,0 +1,12 @@
+using FluentValidation;
+
+namespace Indotalent.Features.Sales.SalesOrder.Cqrs;
+
+public class CreateSalesOrderValidator : AbstractValidator<CreateSalesOrderRequest>
+{
+    public CreateSalesOrderValidator()
+    {
+        RuleFor(x => x.OrderDate).NotEmpty().WithMessage("Date is required");
+        RuleFor(x => x.CustomerId).NotEmpty().WithMessage("Customer is required");
+    }
+}

Features/Sales/SalesOrder/Cqrs/DeleteSalesOrderByIdHandler.cs

@@ -0,0 +1,25 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.SalesOrder.Cqrs;
+
+public record DeleteSalesOrderByIdCommand(string Id) : IRequest<bool>;
+
+public class DeleteSalesOrderByIdHandler : IRequestHandler<DeleteSalesOrderByIdCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public DeleteSalesOrderByIdHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(DeleteSalesOrderByIdCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.SalesOrder
+            .FirstOrDefaultAsync(x => x.Id == request.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        _context.SalesOrder.Remove(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+        return true;
+    }
+}

Features/Sales/SalesOrder/Cqrs/DeleteSalesOrderItemHandler.cs

@@ -0,0 +1,34 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+using Indotalent.Shared.Utils;
+
+namespace Indotalent.Features.Sales.SalesOrder.Cqrs;
+
+public record DeleteSalesOrderItemCommand(string Id) : IRequest<bool>;
+
+public class DeleteSalesOrderItemHandler : IRequestHandler<DeleteSalesOrderItemCommand, bool>
+{
+    private readonly AppDbContext _context;
+    public DeleteSalesOrderItemHandler(AppDbContext context) => _context = context;
+
+    public async Task<bool> Handle(DeleteSalesOrderItemCommand request, CancellationToken cancellationToken)
+    {
+        var entity = await _context.SalesOrderItem
+            .FirstOrDefaultAsync(x => x.Id == request.Id, cancellationToken);
+
+        if (entity == null) return false;
+
+        var salesOrderId = entity.SalesOrderId;
+
+        _context.SalesOrderItem.Remove(entity);
+        await _context.SaveChangesAsync(cancellationToken);
+
+        if (!string.IsNullOrEmpty(salesOrderId))
+        {
+            SalesOrderHelper.Recalculate(_context, salesOrderId);
+        }
+
+        return true;
+    }
+}

Features/Sales/SalesOrder/Cqrs/GetSalesOrderByIdHandler.cs

@@ -0,0 +1,116 @@
+using Indotalent.Infrastructure.Database;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace Indotalent.Features.Sales.SalesOrder.Cqrs;
+
+public class SalesOrderItemResponse
+{
+    public string? Id { get; set; }
+    public string? ProductId { get; set; }
+    public string? ProductName { get; set; }
+    public string? Summary { get; set; }
+    public decimal? UnitPrice { get; set; }
+    public double? Quantity { get; set; }
+    public decimal? Total { get; set; }
+}
+
+public class GetSalesOrderByIdResponse
+{
+    public string? Id { get; set; }
+    public string? AutoNumber { get; set; }
+    public DateTime? OrderDate { get; set; }
+    public Data.Enums.SalesOrderStatus OrderStatus { get; set; }
+    public string? Description { get; set; }
+    public string? CustomerId { get; set; }
+    public string? CustomerName { get; set; }
+    public string? CustomerStreet { get; set; }
+    public string? CustomerCity { get; set; }
+    public string? CustomerState { get; set; }
+    public string? CustomerZipCode { get; set; }
+    public string? CustomerPhone { get; set; }
+    public string? CustomerEmail { get; set; }
+    public string? CompanyName { get; set; }
+    public string? CompanyStreet { get; set; }
+    public string? CompanyCity { get; set; }
+    public string? CompanyState { get; set; }
+    public string? CompanyZipCode { get; set; }
+    public string? CompanyPhone { get; set; }
+    public string? CompanyEmail { get; set; }
+    public string? CurrencySymbol { get; set; }
+    public string? TaxId { get; set; }
+    public decimal? BeforeTaxAmount { get; set; }
+    public decimal? TaxAmount { get; set; }
+    public decimal? AfterTaxAmount { get; set; }
+    public DateTimeOffset? CreatedAt { get; set; }
+    public string? CreatedBy { get; set; }
+    public DateTimeOffset? UpdatedAt { get; set; }
+    public string? UpdatedBy { get; set; }
+    public List<SalesOrderItemResponse> Items { get; set; } = new();
+}
+
+public record GetSalesOrderByIdQuery(string Id) : IRequest<GetSalesOrderByIdResponse?>;
+
+public class GetSalesOrderByIdHandler : IRequestHandler<GetSalesOrderByIdQuery, GetSalesOrderByIdResponse?>
+{
+    private readonly AppDbContext _context;
+    public GetSalesOrderByIdHandler(AppDbContext context) => _context = context;
+
+    public async Task<GetSalesOrderByIdResponse?> Handle(GetSalesOrderByIdQuery request, CancellationToken cancellationToken)
+    {
+        var company = await _context.Company
+            .AsNoTracking()
+            .Include(x => x.Currency)
+            .OrderByDescending(x => x.IsDefault)
+            .FirstOrDefaultAsync(cancellationToken);
+
+        return await _context.SalesOrder
+            .AsNoTracking()
+            .Include(x => x.Customer)
+            .Include(x => x.SalesOrderItemList)
+            .ThenInclude(x => x.Product)
+            .Where(x => x.Id == request.Id)
+            .Select(x => new GetSalesOrderByIdResponse
+            {
+                Id = x.Id,
+                AutoNumber = x.AutoNumber,
+                OrderDate = x.OrderDate,
+                OrderStatus = x.OrderStatus,
+                Description = x.Description,
+                CustomerId = x.CustomerId,
+                CustomerName = x.Customer!.Name,
+                CustomerStreet = x.Customer!.Street,
+                CustomerCity = x.Customer!.City,
+                CustomerState = x.Customer!.State,
+                CustomerZipCode = x.Customer!.ZipCode,
+                CustomerPhone = x.Customer!.PhoneNumber,
+                CustomerEmail = x.Customer!.EmailAddress,
+                CompanyName = company != null ? company.Name : string.Empty,
+                CompanyStreet = company != null ? company.StreetAddress : string.Empty,
+                CompanyCity = company != null ? company.City : string.Empty,
+                CompanyState = company != null ? company.StateProvince : string.Empty,
+                CompanyZipCode = company != null ? company.ZipCode : string.Empty,
+                CompanyPhone = company != null ? company.Phone : string.Empty,
+                CompanyEmail = company != null ? company.Email : string.Empty,
+                CurrencySymbol = company != null && company.Currency != null ? company.Currency.Symbol : "IDR",
+                TaxId = x.TaxId,
+                BeforeTaxAmount = x.BeforeTaxAmount,
+                TaxAmount = x.TaxAmount,
+                AfterTaxAmount = x.AfterTaxAmount,
+                CreatedAt = x.CreatedAt,
+                CreatedBy = x.CreatedBy,
+                UpdatedAt = x.UpdatedAt,
+                UpdatedBy = x.UpdatedBy,
+                Items = x.SalesOrderItemList.Select(i => new SalesOrderItemResponse
+                {
+                    Id = i.Id,
+                    ProductId = i.ProductId,
+                    ProductName = i.Product!.Name,
+                    Summary = i.Summary,
+                    UnitPrice = i.UnitPrice,
+                    Quantity = i.Quantity,
+                    Total = i.Total
+                }).ToList()
+            }).FirstOrDefaultAsync(cancellationToken);
+    }
+}