go2ismail/blazor-saas-crm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

initial commit

Browse Source
This commit is contained in:
go2ismail
2026-07-21 14:14:44 +07:00
commit fa7dbb970d
1359 changed files with 104110 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Features/Pipeline/Campaign/Components/CampaignPage.razor
+28
View File
@@ -0,0 +1,28 @@
@page "/pipeline/campaign"
@using Indotalent.Features.Pipeline.Campaign.Cqrs
@using Indotalent.Features.Pipeline.Campaign.Components
@using MudBlazor
@if (_currentView == ViewMode.Create)
{
<_CampaignCreateForm OnCancel="BackToTable" OnSuccess="HandleSuccess" />
}
else if (_currentView == ViewMode.Update || _currentView == ViewMode.View)
{
<_CampaignUpdateForm Data="_selectedData!" ReadOnly="@(_currentView == ViewMode.View)" OnCancel="BackToTable" OnSuccess="HandleSuccess" />
}
else
{
<_CampaignDataTable 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 UpdateCampaignRequest? _selectedData;
private void ShowCreate() => _currentView = ViewMode.Create;
private void ShowUpdate(UpdateCampaignRequest 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/Pipeline/Campaign/Components/_BudgetCreateForm.razor
+91
View File
@@ -0,0 +1,91 @@
@using Indotalent.Features.Pipeline.Campaign.Cqrs
@using MudBlazor
@inject CampaignService CampaignService
@inject ISnackbar Snackbar
<MudDialog>
<DialogContent>
<MudForm @ref="_form" Model="_model">
<MudGrid Spacing="2">
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Budget Title</MudText>
<MudTextField @bind-Value="_model.Title" Required="true" Variant="Variant.Outlined" Margin="Margin.Dense" FullWidth="true" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Amount</MudText>
<MudNumericField @bind-Value="_model.Amount" Variant="Variant.Outlined" Margin="Margin.Dense" T="decimal?" HideSpinButtons="true" FullWidth="true" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Date</MudText>
<MudDatePicker @bind-Date="_model.BudgetDate" Variant="Variant.Outlined" Margin="Margin.Dense" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Status</MudText>
<MudSelect T="Indotalent.Data.Enums.BudgetStatus" @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.BudgetStatuses)
{
<MudSelectItem Value="@((Indotalent.Data.Enums.BudgetStatus)item.Value)">@item.Name</MudSelectItem>
}
</MudSelect>
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
<MudTextField @bind-Value="_model.Description" Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
</MudItem>
</MudGrid>
</MudForm>
</DialogContent>
<DialogActions>
<MudButton OnClick="Cancel" Variant="Variant.Text" Style="text-transform: none; font-weight: 700;">Cancel</MudButton>
<MudButton Color="Color.Primary" OnClick="Submit" Variant="Variant.Filled" Disabled="_processing" Style="border-radius: 4px; text-transform: none; font-weight: 700;">
@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 Budget</MudText>
}
</MudButton>
</DialogActions>
</MudDialog>
@code {
[CascadingParameter] IMudDialogInstance MudDialog { get; set; } = default!;
[Parameter] public string CampaignId { get; set; } = string.Empty;
[Parameter] public CampaignLookupResponse Lookup { get; set; } = new();
private MudForm _form = default!;
private CreateBudgetRequest _model = new();
private bool _processing = false;
private void Cancel() => MudDialog.Cancel();
private async Task Submit()
{
await _form.Validate();
if (!_form.IsValid) return;
_processing = true;
_model.CampaignId = CampaignId;
try
{
var response = await CampaignService.AddBudgetAsync(_model);
await Task.Delay(500);
if (response != null && response.IsSuccess)
{
Snackbar.Add("Budget added successfully", Severity.Success);
MudDialog.Close(DialogResult.Ok(true));
}
}
catch (Exception ex)
{
Snackbar.Add($"Error: {ex.Message}", Severity.Error);
}
finally
{
_processing = false;
}
}
}
Features/Pipeline/Campaign/Components/_BudgetDataTable.razor
+94
View File
@@ -0,0 +1,94 @@
@using Indotalent.Features.Pipeline.Campaign.Cqrs
@using Indotalent.Features.Root.Shared
@using MudBlazor
@inject CampaignService CampaignService
@inject IDialogService DialogService
@inject ISnackbar Snackbar
<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; border: 1px solid #E5E7EB;">
<div style="padding: 16px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff;">
<MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 600;">Campaign Budgets</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 Budget</MudButton>
}
</div>
<MudTable Class="mud-table-styled" Striped="true" Items="Items" Hover="true" Elevation="0" Dense="true" T="CampaignBudgetResponse" Context="budgetContext">
<HeaderContent>
<MudTh Style="font-weight: 500; letter-spacing: 0.05em;">No</MudTh>
<MudTh Style="font-weight: 500; letter-spacing: 0.05em;">Title</MudTh>
<MudTh Style="text-align: right; font-weight: 500; letter-spacing: 0.05em;">Amount</MudTh>
@if (!ReadOnly)
{
<MudTh Style="width: 100px; text-align: right; font-weight: 500; letter-spacing: 0.05em;">Actions</MudTh>
}
</HeaderContent>
<RowTemplate>
<MudTd DataLabel="No">@budgetContext.AutoNumber</MudTd>
<MudTd DataLabel="Title">@budgetContext.Title</MudTd>
<MudTd DataLabel="Amount" Style="text-align: right;">@budgetContext.Amount?.ToString("N0")</MudTd>
@if (!ReadOnly)
{
<MudTd Style="text-align: right;">
<MudIconButton Icon="@Icons.Material.Filled.Edit" Size="Size.Small" Color="Color.Primary" OnClick="@(() => OnEditClick(budgetContext))" />
<MudIconButton Icon="@Icons.Material.Filled.Delete" Size="Size.Small" Color="Color.Error" OnClick="@(() => OnDeleteClick(budgetContext))" />
</MudTd>
}
</RowTemplate>
</MudTable>
</MudPaper>
<style>
.mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
.mud-table-styled .mud-table-cell { padding-top: 0.75rem; padding-bottom: 0.75rem; color: #6B7280; font-size: 0.875rem; }
.mud-table-styled .mud-table-cell .mud-text-body2 { font-weight: 600; color: #374151; }
.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 CampaignId { get; set; } = string.Empty;
[Parameter] public List<CampaignBudgetResponse> Items { get; set; } = new();
[Parameter] public CampaignLookupResponse Lookup { get; set; } = new();
[Parameter] public bool ReadOnly { get; set; } = false;
[Parameter] public EventCallback OnChanged { get; set; }
private async Task OnAddClick()
{
var p = new DialogParameters { ["CampaignId"] = CampaignId, ["Lookup"] = Lookup };
var d = await DialogService.ShowAsync<_BudgetCreateForm>("Add Budget", p, new DialogOptions { MaxWidth = MaxWidth.Small, FullWidth = true });
var result = await d.Result;
if (result != null && !result.Canceled)
{
await OnChanged.InvokeAsync();
}
}
private async Task OnEditClick(CampaignBudgetResponse item)
{
var p = new DialogParameters { ["Data"] = item, ["Lookup"] = Lookup };
var d = await DialogService.ShowAsync<_BudgetUpdateForm>("Edit Budget", p, new DialogOptions { MaxWidth = MaxWidth.Small, FullWidth = true });
var result = await d.Result;
if (result != null && !result.Canceled)
{
await OnChanged.InvokeAsync();
}
}
private async Task OnDeleteClick(CampaignBudgetResponse item)
{
var p = new DialogParameters { ["ContentText"] = $"Are you sure you want to delete budget {item.AutoNumber}?" };
var d = await DialogService.ShowAsync<_DeleteConfirmation>("Delete Confirmation", p, new DialogOptions { MaxWidth = MaxWidth.ExtraSmall, FullWidth = true });
var result = await d.Result;
if (result != null && !result.Canceled)
{
if (await CampaignService.DeleteBudgetAsync(item.Id!))
{
Snackbar.Add("Budget deleted successfully", Severity.Success);
await OnChanged.InvokeAsync();
}
}
}
}
Features/Pipeline/Campaign/Components/_BudgetUpdateForm.razor
+100
View File
@@ -0,0 +1,100 @@
@using Indotalent.Features.Pipeline.Campaign.Cqrs
@using MudBlazor
@inject CampaignService CampaignService
@inject ISnackbar Snackbar
<MudDialog>
<DialogContent>
<MudForm @ref="_form" Model="_model">
<MudGrid Spacing="2">
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Budget Title</MudText>
<MudTextField @bind-Value="_model.Title" Required="true" Variant="Variant.Outlined" Margin="Margin.Dense" FullWidth="true" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Amount</MudText>
<MudNumericField @bind-Value="_model.Amount" Variant="Variant.Outlined" Margin="Margin.Dense" T="decimal?" HideSpinButtons="true" FullWidth="true" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Date</MudText>
<MudDatePicker @bind-Date="_model.BudgetDate" Variant="Variant.Outlined" Margin="Margin.Dense" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Status</MudText>
<MudSelect T="Indotalent.Data.Enums.BudgetStatus" @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.BudgetStatuses)
{
<MudSelectItem Value="@((Indotalent.Data.Enums.BudgetStatus)item.Value)">@item.Name</MudSelectItem>
}
</MudSelect>
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
<MudTextField @bind-Value="_model.Description" Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
</MudItem>
</MudGrid>
</MudForm>
</DialogContent>
<DialogActions>
<MudButton OnClick="Cancel" Variant="Variant.Text" Style="text-transform: none; font-weight: 700;">Cancel</MudButton>
<MudButton Color="Color.Primary" OnClick="Submit" Variant="Variant.Filled" Disabled="_processing" Style="border-radius: 4px; text-transform: none; font-weight: 700;">
@if (_processing)
{
<MudProgressCircular Size="Size.Small" Indeterminate="true" />
<MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
}
else
{
<MudText>Save Changes</MudText>
}
</MudButton>
</DialogActions>
</MudDialog>
@code {
[CascadingParameter] IMudDialogInstance MudDialog { get; set; } = default!;
[Parameter] public CampaignBudgetResponse Data { get; set; } = new();
[Parameter] public CampaignLookupResponse Lookup { get; set; } = new();
private MudForm _form = default!;
private UpdateBudgetRequest _model = new();
private bool _processing = false;
protected override void OnInitialized()
{
_model.Id = Data.Id;
_model.Title = Data.Title;
_model.Amount = Data.Amount;
_model.BudgetDate = Data.BudgetDate;
_model.Status = Data.Status;
_model.Description = Data.Description;
}
private void Cancel() => MudDialog.Cancel();
private async Task Submit()
{
await _form.Validate();
if (!_form.IsValid) return;
_processing = true;
try
{
var res = await CampaignService.UpdateBudgetAsync(_model);
await Task.Delay(500);
if (res != null && res.IsSuccess)
{
Snackbar.Add("Budget updated successfully", Severity.Success);
MudDialog.Close(DialogResult.Ok(true));
}
}
catch (Exception ex)
{
Snackbar.Add($"Error: {ex.Message}", Severity.Error);
}
finally
{
_processing = false;
}
}
}
Features/Pipeline/Campaign/Components/_CampaignCreateForm.razor
+123
View File
@@ -0,0 +1,123 @@
@using Indotalent.Features.Pipeline.Campaign.Cqrs
@using Indotalent.Shared.Utils
@using MudBlazor
@inject CampaignService CampaignService
@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 New Campaign</MudText>
<MudText Typo="Typo.body2" Style="color: #64748b;">Initiate a new marketing campaign and track progress.</MudText>
</div>
</div>
</MudPaper>
<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 0px; border: 1px solid #DCEBFA;">
<MudForm @ref="_form" Model="_model">
<MudGrid Spacing="3">
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Campaign Title</MudText>
<MudTextField @bind-Value="_model.Title"
For="@(() => _model.Title)"
Validation="@(_validator.ValidateValue())"
Variant="Variant.Outlined" Margin="Margin.Dense" FullWidth="true" />
</MudItem>
<MudItem xs="12" sm="6">
<MudText Typo="Typo.subtitle2" Class="mb-1">Sales Team</MudText>
<MudSelect T="string" @bind-Value="_model.SalesTeamId" Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" FullWidth="true" AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter">
@foreach (var item in _lookup.SalesTeams)
{
<MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
}
</MudSelect>
</MudItem>
<MudItem xs="12" sm="6">
<MudText Typo="Typo.subtitle2" Class="mb-1">Status</MudText>
<MudSelect T="Indotalent.Data.Enums.CampaignStatus" @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.CampaignStatus)item.Value)">@item.Name</MudSelectItem>
}
</MudSelect>
</MudItem>
<MudItem xs="12" sm="6">
<MudText Typo="Typo.subtitle2" Class="mb-1">Start Date</MudText>
<MudDatePicker @bind-Date="_model.CampaignDateStart" Variant="Variant.Outlined" Margin="Margin.Dense" />
</MudItem>
<MudItem xs="12" sm="6">
<MudText Typo="Typo.subtitle2" Class="mb-1">Finish Date</MudText>
<MudDatePicker @bind-Date="_model.CampaignDateFinish" Variant="Variant.Outlined" Margin="Margin.Dense" />
</MudItem>
<MudItem xs="12" sm="6">
<MudText Typo="Typo.subtitle2" Class="mb-1">Target Revenue</MudText>
<MudNumericField @bind-Value="_model.TargetRevenueAmount" Variant="Variant.Outlined" Margin="Margin.Dense" T="decimal?" HideSpinButtons="true" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
<MudTextField @bind-Value="_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; border: 1px solid #e0e0e0; text-transform: none; font-weight: 700;">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 Campaign</MudText>
}
</MudButton>
</div>
</MudForm>
</MudPaper>
@code {
[Parameter] public EventCallback OnCancel { get; set; }
[Parameter] public EventCallback OnSuccess { get; set; }
private MudForm _form = default!;
private CreateCampaignValidator _validator = new();
private CreateCampaignRequest _model = new() { Status = Indotalent.Data.Enums.CampaignStatus.Draft };
private CampaignLookupResponse _lookup = new();
private bool _processing = false;
protected override async Task OnInitializedAsync()
{
var res = await CampaignService.GetLookupDataAsync();
if (res != null && res.IsSuccess) { _lookup = res.Value!; }
}
private async Task Submit()
{
await _form.Validate();
if (!_form.IsValid) return;
_processing = true;
try
{
var response = await CampaignService.CreateCampaignAsync(_model);
await Task.Delay(500);
if (response != null && response.IsSuccess)
{
Snackbar.Add("Campaign created successfully", Severity.Success);
await OnSuccess.InvokeAsync();
}
}
catch (Exception ex)
{
Snackbar.Add($"Error: {ex.Message}", Severity.Error);
}
finally { _processing = false; }
}
}
Features/Pipeline/Campaign/Components/_CampaignDataTable.razor
+260
View File
@@ -0,0 +1,260 @@
@using Indotalent.ConfigBackEnd.Extensions
@using Indotalent.Features.Pipeline.Campaign
@using Indotalent.Features.Pipeline.Campaign.Cqrs
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.JSInterop
@using MudBlazor
@using Features.Root.Shared
@using ClosedXML.Excel
@using System.IO
@inject CampaignService CampaignService
@inject IDialogService DialogService
@inject ISnackbar Snackbar
@inject IJSRuntime JSRuntime
<MudPaper Elevation="0" 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: 700; color: #111827;">Campaign Management</MudText>
<MudText Typo="Typo.body2" Style="color: #9CA3AF;">Manage marketing campaigns, budgets, and expenses.</MudText>
</div>
<div class="d-flex align-center gap-2">
<MudIcon Icon="@Icons.Material.Filled.Campaign" Size="Size.Small" Color="Color.Default" />
<MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
<MudText Typo="Typo.caption" Style="color: #9CA3AF;">Pipeline</MudText>
<MudText Typo="Typo.caption" Style="color: #9CA3AF;">/</MudText>
<MudText Typo="Typo.caption" Style="font-weight: 600; color: #111827;">Campaign</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"
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;">
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;">
@if (_isExporting) { <MudProgressCircular Size="Size.Small" Indeterminate="true" /> } 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;">
@if (_isRefreshing) { <MudProgressCircular 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;">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;">Edit</MudButton>
<MudButton Variant="Variant.Outlined" Color="Color.Error" StartIcon="@Icons.Material.Filled.Delete" OnClick="OnDelete" Size="Size.Small" Style="background: white; border: 1px solid #FCA5A5; color: #EF4444; text-transform: none; font-weight: 500; border-radius: 6px;">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 New Campaign
</MudButton>
}
</div>
</div>
<MudTable Class="mud-table-styled" Striped="true" Items="@GetPagedData()" Hover="true" Elevation="0" CustomHeader="true" Dense="true" T="GetCampaignListResponse" OnRowClick="@((args) => _selectedItem = args.Item)" Loading="@_isRefreshing">
<HeaderContent>
<MudTh Style="width: 50px; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; letter-spacing: 0.05em;"></MudTh>
<MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; white-space: nowrap; letter-spacing: 0.05em;">
<MudTableSortLabel SortBy="new Func<GetCampaignListResponse, object>(x => x.AutoNumber!)">No</MudTableSortLabel>
</MudTh>
<MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; white-space: nowrap; letter-spacing: 0.05em;">
<MudTableSortLabel SortBy="new Func<GetCampaignListResponse, object>(x => x.Title!)">Title</MudTableSortLabel>
</MudTh>
<MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; white-space: nowrap; letter-spacing: 0.05em;">
<MudTableSortLabel SortBy="new Func<GetCampaignListResponse, object>(x => x.SalesTeamName!)">Sales Team</MudTableSortLabel>
</MudTh>
<MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; white-space: nowrap; letter-spacing: 0.05em;">
<MudTableSortLabel SortBy="new Func<GetCampaignListResponse, object>(x => x.TargetRevenueAmount!)">Target Revenue</MudTableSortLabel>
</MudTh>
<MudTh Style="font-weight: 600; color: #6B7280; text-transform: uppercase; font-size: 0.6875rem; background-color: #F9FAFB; border-bottom: 1px solid #E5E7EB; white-space: nowrap; letter-spacing: 0.05em;">
<MudTableSortLabel SortBy="new Func<GetCampaignListResponse, 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>@context.AutoNumber</MudTd>
<MudTd><MudText Typo="Typo.body2" Style="font-weight: 500;">@context.Title</MudText></MudTd>
<MudTd>@context.SalesTeamName</MudTd>
<MudTd>@context.TargetRevenueAmount?.ToString("N0")</MudTd>
<MudTd>
<MudChip T="string" Color="@GetStatusColor(context.Status)" Size="Size.Small" Variant="Variant.Filled" Style="font-weight: 600; border-radius: 6px;">@context.Status?.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="color: #9CA3AF; font-size: 0.75rem; font-weight: 500;">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" AnchorOrigin="Origin.BottomCenter">
<MudSelectItem Value="5" /><MudSelectItem Value="10" /><MudSelectItem Value="50" /><MudSelectItem Value="500" /><MudSelectItem Value="1000" />
</MudSelect>
<MudText Typo="Typo.caption" Style="color: #9CA3AF; font-size: 0.75rem; font-weight: 500; margin-left: 12px;">
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 ? "background: transparent; color: #D1D5DB; border: none;" : "background-color: white; border: 1px solid #D1D5DB; color: #6B7280; 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: #6B7280; background: white; border: 1px solid #D1D5DB; border-radius: 6px;")">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: #6B7280; background: white; border: 1px solid #D1D5DB; border-radius: 6px;")">Next</MudButton>
<MudIconButton Icon="@Icons.Material.Filled.LastPage" Size="Size.Small" OnClick="@(() => OnPageChanged(_totalPage))" Disabled="@(_currentPage == _totalPage || _totalPage == 0)" Style="@(_currentPage == _totalPage || _totalPage == 0 ? "background: transparent; color: #D1D5DB; border: none;" : "background-color: white; border: 1px solid #D1D5DB; color: #6B7280; border-radius: 6px;")" />
</div>
</div>
</MudPaper>
<style>
.mud-input-outlined-border { border-radius: 0px !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<UpdateCampaignRequest> OnEdit { get; set; }
[Parameter] public EventCallback<UpdateCampaignRequest> OnView { get; set; }
private List<GetCampaignListResponse> _items = new();
private GetCampaignListResponse? _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 CampaignService.GetCampaignListAsync();
await Task.Delay(500);
if (response != null && response.IsSuccess) { _items = response.Value ?? new(); }
}
finally { _isRefreshing = false; StateHasChanged(); }
}
private IEnumerable<GetCampaignListResponse> GetFilteredData()
{
if (string.IsNullOrWhiteSpace(_searchString)) return _items;
return _items.Where(x =>
(x.Title?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
(x.AutoNumber?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false) ||
(x.SalesTeamName?.Contains(_searchString, StringComparison.OrdinalIgnoreCase) ?? false)
);
}
private IEnumerable<GetCampaignListResponse> GetPagedData() => GetFilteredData().Skip(_skip).Take(_top);
private Color GetStatusColor(string? status) => status switch {
"Finished" => Color.Success, "OnProgress" => Color.Info, "Confirmed" => Color.Primary, "Cancelled" => Color.Error, "Draft" => Color.Default, _ => Color.Default
};
private async Task ExportToExcel()
{
_isExporting = true;
try
{
await Task.Delay(1000);
using (var workbook = new XLWorkbook())
{
var worksheet = workbook.Worksheets.Add("Campaigns");
worksheet.Cell(1, 1).Value = "No"; worksheet.Cell(1, 2).Value = "Title";
worksheet.Cell(1, 3).Value = "Sales Team"; worksheet.Cell(1, 4).Value = "Target Revenue";
worksheet.Cell(1, 5).Value = "Status";
var row = 1;
foreach (var item in GetFilteredData())
{
row++;
worksheet.Cell(row, 1).Value = item.AutoNumber; worksheet.Cell(row, 2).Value = item.Title;
worksheet.Cell(row, 3).Value = item.SalesTeamName; worksheet.Cell(row, 4).Value = item.TargetRevenueAmount;
worksheet.Cell(row, 5).Value = item.Status;
}
using (var stream = new MemoryStream())
{
workbook.SaveAs(stream);
var content = Convert.ToBase64String(stream.ToArray());
await JSRuntime.InvokeVoidAsync("downloadFile", "Campaign_List.xlsx", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", content);
}
}
}
finally { _isExporting = false; }
}
private void OnSearchClick() { _skip = 0; _selectedItem = null; StateHasChanged(); }
private void HandleSearchKeyDown(KeyboardEventArgs e) { if (e.Key == "Enter") OnSearchClick(); }
private void OnPageChanged(int page) { _skip = (page - 1) * _top; _selectedItem = null; }
private void OnPageSizeChanged(int size) { _top = size; _skip = 0; }
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<UpdateCampaignRequest?> MapToUpdateRequest(string id)
{
var response = await CampaignService.GetCampaignByIdAsync(id);
if (response != null && response.IsSuccess)
{
var d = response.Value!;
return new UpdateCampaignRequest {
Id = d.Id, Title = d.Title, Description = d.Description, TargetRevenueAmount = d.TargetRevenueAmount,
CampaignDateStart = d.CampaignDateStart, CampaignDateFinish = d.CampaignDateFinish,
Status = d.Status, SalesTeamId = d.SalesTeamId,
CreatedAt = d.CreatedAt, CreatedBy = d.CreatedBy, UpdatedAt = d.UpdatedAt, UpdatedBy = d.UpdatedBy
};
}
return null;
}
private async Task OnDelete()
{
if (_selectedItem == null) return;
var parameters = new DialogParameters<_DeleteConfirmation> { { x => x.ContentText, _selectedItem.Title } };
var dialog = await DialogService.ShowAsync<_DeleteConfirmation>("", parameters, new DialogOptions { MaxWidth = MaxWidth.ExtraSmall, FullWidth = true });
var result = await dialog.Result;
if (result != null && !result.Canceled) { if (await CampaignService.DeleteCampaignAsync(_selectedItem.Id!)) { await LoadData(); Snackbar.Add("Deleted successfully", Severity.Success); } }
}
}
Features/Pipeline/Campaign/Components/_CampaignUpdateForm.razor
+210
View File
@@ -0,0 +1,210 @@
@using Indotalent.Features.Pipeline.Campaign.Cqrs
@using Indotalent.Features.Pipeline.Campaign.Components
@using MudBlazor
@using Indotalent.ConfigBackEnd.Extensions
@inject CampaignService CampaignService
@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;">@(ReadOnly ? "Campaign Details" : "Edit Campaign")</MudText>
<MudText Typo="Typo.body2" Style="color: #64748b;">Manage campaign specifications and financial tracking.</MudText>
</div>
</div>
</MudPaper>
<MudPaper Elevation="0" Outlined="true" Class="pa-8" Style="border-radius: 0px; border: 1px solid #DCEBFA;">
@if (_isDataLoading)
{
<div class="d-flex justify-center pa-10"><MudProgressCircular Color="Color.Primary" Indeterminate="true" /></div>
}
else
{
<MudForm @ref="_form" Model="_model">
<MudGrid Spacing="3">
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Campaign Title</MudText>
<MudTextField @bind-Value="_model.Title" ReadOnly="ReadOnly" Variant="Variant.Outlined" Margin="Margin.Dense" FullWidth="true" />
</MudItem>
<MudItem xs="12" sm="6">
<MudText Typo="Typo.subtitle2" Class="mb-1">Sales Team</MudText>
<MudSelect T="string" @bind-Value="_model.SalesTeamId" ReadOnly="ReadOnly" Variant="Variant.Outlined" Margin="Margin.Dense" AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter" FullWidth="true">
@foreach (var item in _lookup.SalesTeams)
{
<MudSelectItem Value="@item.Id">@item.Name</MudSelectItem>
}
</MudSelect>
</MudItem>
<MudItem xs="12" sm="6">
<MudText Typo="Typo.subtitle2" Class="mb-1">Status</MudText>
<MudSelect T="Indotalent.Data.Enums.CampaignStatus" @bind-Value="_model.Status" ReadOnly="ReadOnly" Variant="Variant.Outlined" Margin="Margin.Dense" AnchorOrigin="Origin.BottomCenter" TransformOrigin="Origin.TopCenter" FullWidth="true">
@foreach (var item in _lookup.Statuses)
{
<MudSelectItem Value="@((Indotalent.Data.Enums.CampaignStatus)item.Value)">@item.Name</MudSelectItem>
}
</MudSelect>
</MudItem>
<MudItem xs="12" sm="6">
<MudText Typo="Typo.subtitle2" Class="mb-1">Start Date</MudText>
<MudDatePicker @bind-Date="_model.CampaignDateStart" ReadOnly="ReadOnly" Variant="Variant.Outlined" Margin="Margin.Dense" />
</MudItem>
<MudItem xs="12" sm="6">
<MudText Typo="Typo.subtitle2" Class="mb-1">Finish Date</MudText>
<MudDatePicker @bind-Date="_model.CampaignDateFinish" ReadOnly="ReadOnly" Variant="Variant.Outlined" Margin="Margin.Dense" />
</MudItem>
<MudItem xs="12" sm="6">
<MudText Typo="Typo.subtitle2" Class="mb-1">Target Revenue</MudText>
<MudNumericField @bind-Value="_model.TargetRevenueAmount" ReadOnly="ReadOnly" Variant="Variant.Outlined" Margin="Margin.Dense" T="decimal?" HideSpinButtons="true" />
</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="3" FullWidth="true" />
</MudItem>
<MudItem xs="12" Class="mt-6">
<MudTabs Elevation="0" Outlined="true" Position="Position.Top" Rounded="false" Border="true" ApplyEffectsToContainer="true">
<MudTabPanel Text="Budgets">
<div class="pa-4">
<_BudgetDataTable CampaignId="@_model.Id" Items="_budgets" Lookup="_lookup" ReadOnly="ReadOnly" OnChanged="RefreshDetails" />
</div>
</MudTabPanel>
<MudTabPanel Text="Expenses">
<div class="pa-4">
<_ExpenseDataTable CampaignId="@_model.Id" Items="_expenses" Lookup="_lookup" ReadOnly="ReadOnly" OnChanged="RefreshDetails" />
</div>
</MudTabPanel>
</MudTabs>
</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" Style="border-radius: 4px; border: 1px solid #e0e0e0; text-transform: none; font-weight: 700;">
@(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 Size="Size.Small" Indeterminate="true" Class="ms-n1" />
<MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Updating...</MudText>
}
else
{
<MudText>Save Changes</MudText>
}
</MudButton>
}
</div>
</MudForm>
}
</MudPaper>
@code {
[Parameter] public UpdateCampaignRequest 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 UpdateCampaignRequest _model = new();
private CampaignLookupResponse _lookup = new();
private List<CampaignBudgetResponse> _budgets = new();
private List<CampaignExpenseResponse> _expenses = new();
private bool _processing = false;
private bool _isDataLoading = true;
protected override async Task OnInitializedAsync()
{
_isDataLoading = true;
try
{
var resLookup = await CampaignService.GetLookupDataAsync();
if (resLookup != null && resLookup.IsSuccess)
{
_lookup = resLookup.Value!;
}
var resDetail = await CampaignService.GetCampaignByIdAsync(Data.Id!);
if (resDetail != null && resDetail.IsSuccess)
{
var d = resDetail.Value!;
_model = new UpdateCampaignRequest
{
Id = d.Id,
Title = d.Title,
Description = d.Description,
TargetRevenueAmount = d.TargetRevenueAmount,
CampaignDateStart = d.CampaignDateStart,
CampaignDateFinish = d.CampaignDateFinish,
Status = d.Status,
SalesTeamId = d.SalesTeamId,
CreatedAt = d.CreatedAt,
CreatedBy = d.CreatedBy,
UpdatedAt = d.UpdatedAt,
UpdatedBy = d.UpdatedBy
};
_budgets = d.Budgets;
_expenses = d.Expenses;
}
}
finally
{
_isDataLoading = false;
}
}
private async Task RefreshDetails()
{
var res = await CampaignService.GetCampaignByIdAsync(_model.Id!);
if (res != null && res.IsSuccess)
{
_budgets = res.Value!.Budgets;
_expenses = res.Value!.Expenses;
_model.CreatedAt = res.Value.CreatedAt;
_model.CreatedBy = res.Value.CreatedBy;
_model.UpdatedAt = res.Value.UpdatedAt;
_model.UpdatedBy = res.Value.UpdatedBy;
}
}
private async Task Submit()
{
await _form.Validate();
if (!_form.IsValid) return;
_processing = true;
try
{
var response = await CampaignService.UpdateCampaignAsync(_model);
await Task.Delay(500);
if (response != null && response.IsSuccess)
{
Snackbar.Add("Campaign updated successfully", Severity.Success);
await OnSuccess.InvokeAsync();
}
}
catch (Exception ex)
{
Snackbar.Add($"Error: {ex.Message}", Severity.Error);
}
finally
{
_processing = false;
}
}
}
Features/Pipeline/Campaign/Components/_ExpenseCreateForm.razor
+91
View File
@@ -0,0 +1,91 @@
@using Indotalent.Features.Pipeline.Campaign.Cqrs
@using MudBlazor
@inject CampaignService CampaignService
@inject ISnackbar Snackbar
<MudDialog>
<DialogContent>
<MudForm @ref="_form" Model="_model">
<MudGrid Spacing="2">
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Expense Title</MudText>
<MudTextField @bind-Value="_model.Title" Required="true" Variant="Variant.Outlined" Margin="Margin.Dense" FullWidth="true" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Amount</MudText>
<MudNumericField @bind-Value="_model.Amount" Variant="Variant.Outlined" Margin="Margin.Dense" T="decimal?" HideSpinButtons="true" FullWidth="true" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Date</MudText>
<MudDatePicker @bind-Date="_model.ExpenseDate" Variant="Variant.Outlined" Margin="Margin.Dense" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Status</MudText>
<MudSelect T="Indotalent.Data.Enums.ExpenseStatus" @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.ExpenseStatuses)
{
<MudSelectItem Value="@((Indotalent.Data.Enums.ExpenseStatus)item.Value)">@item.Name</MudSelectItem>
}
</MudSelect>
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
<MudTextField @bind-Value="_model.Description" Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
</MudItem>
</MudGrid>
</MudForm>
</DialogContent>
<DialogActions>
<MudButton OnClick="Cancel" Variant="Variant.Text" Style="text-transform: none; font-weight: 700;">Cancel</MudButton>
<MudButton Color="Color.Primary" OnClick="Submit" Variant="Variant.Filled" Disabled="_processing" Style="border-radius: 4px; text-transform: none; font-weight: 700;">
@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 Expense</MudText>
}
</MudButton>
</DialogActions>
</MudDialog>
@code {
[CascadingParameter] IMudDialogInstance MudDialog { get; set; } = default!;
[Parameter] public string CampaignId { get; set; } = string.Empty;
[Parameter] public CampaignLookupResponse Lookup { get; set; } = new();
private MudForm _form = default!;
private CreateExpenseRequest _model = new();
private bool _processing = false;
private void Cancel() => MudDialog.Cancel();
private async Task Submit()
{
await _form.Validate();
if (!_form.IsValid) return;
_processing = true;
_model.CampaignId = CampaignId;
try
{
var response = await CampaignService.AddExpenseAsync(_model);
await Task.Delay(500);
if (response != null && response.IsSuccess)
{
Snackbar.Add("Expense added successfully", Severity.Success);
MudDialog.Close(DialogResult.Ok(true));
}
}
catch (Exception ex)
{
Snackbar.Add($"Error: {ex.Message}", Severity.Error);
}
finally
{
_processing = false;
}
}
}
Features/Pipeline/Campaign/Components/_ExpenseDataTable.razor
+94
View File
@@ -0,0 +1,94 @@
@using Indotalent.Features.Pipeline.Campaign.Cqrs
@using Indotalent.Features.Root.Shared
@using MudBlazor
@inject CampaignService CampaignService
@inject IDialogService DialogService
@inject ISnackbar Snackbar
<MudPaper Elevation="0" Outlined="true" Style="border-radius: 12px; border: 1px solid #E5E7EB;">
<div style="padding: 16px; border-bottom: 1px solid #E5E7EB; display: flex; justify-content: space-between; align-items: center; background-color: #ffffff;">
<MudText Typo="Typo.button" Color="Color.Primary" Style="font-weight: 600;">Campaign Expenses</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 Expense</MudButton>
}
</div>
<MudTable Class="mud-table-styled" Striped="true" Items="Items" Hover="true" Elevation="0" Dense="true" T="CampaignExpenseResponse" Context="expenseContext">
<HeaderContent>
<MudTh Style="font-weight: 500; letter-spacing: 0.05em;">No</MudTh>
<MudTh Style="font-weight: 500; letter-spacing: 0.05em;">Title</MudTh>
<MudTh Style="text-align: right; font-weight: 500; letter-spacing: 0.05em;">Amount</MudTh>
@if (!ReadOnly)
{
<MudTh Style="width: 100px; text-align: right; font-weight: 500; letter-spacing: 0.05em;">Actions</MudTh>
}
</HeaderContent>
<RowTemplate>
<MudTd DataLabel="No">@expenseContext.AutoNumber</MudTd>
<MudTd DataLabel="Title">@expenseContext.Title</MudTd>
<MudTd DataLabel="Amount" Style="text-align: right;">@expenseContext.Amount?.ToString("N0")</MudTd>
@if (!ReadOnly)
{
<MudTd Style="text-align: right;">
<MudIconButton Icon="@Icons.Material.Filled.Edit" Size="Size.Small" Color="Color.Primary" OnClick="@(() => OnEditClick(expenseContext))" />
<MudIconButton Icon="@Icons.Material.Filled.Delete" Size="Size.Small" Color="Color.Error" OnClick="@(() => OnDeleteClick(expenseContext))" />
</MudTd>
}
</RowTemplate>
</MudTable>
</MudPaper>
<style>
.mud-table-styled .mud-table-row:hover { background-color: #F9FAFB !important; }
.mud-table-styled .mud-table-cell { padding-top: 0.75rem; padding-bottom: 0.75rem; color: #6B7280; font-size: 0.875rem; }
.mud-table-styled .mud-table-cell .mud-text-body2 { font-weight: 600; color: #374151; }
.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 CampaignId { get; set; } = string.Empty;
[Parameter] public List<CampaignExpenseResponse> Items { get; set; } = new();
[Parameter] public CampaignLookupResponse Lookup { get; set; } = new();
[Parameter] public bool ReadOnly { get; set; } = false;
[Parameter] public EventCallback OnChanged { get; set; }
private async Task OnAddClick()
{
var p = new DialogParameters { ["CampaignId"] = CampaignId, ["Lookup"] = Lookup };
var d = await DialogService.ShowAsync<_ExpenseCreateForm>("Add Expense", p, new DialogOptions { MaxWidth = MaxWidth.Small, FullWidth = true });
var result = await d.Result;
if (result != null && !result.Canceled)
{
await OnChanged.InvokeAsync();
}
}
private async Task OnEditClick(CampaignExpenseResponse item)
{
var p = new DialogParameters { ["Data"] = item, ["Lookup"] = Lookup };
var d = await DialogService.ShowAsync<_ExpenseUpdateForm>("Edit Expense", p, new DialogOptions { MaxWidth = MaxWidth.Small, FullWidth = true });
var result = await d.Result;
if (result != null && !result.Canceled)
{
await OnChanged.InvokeAsync();
}
}
private async Task OnDeleteClick(CampaignExpenseResponse item)
{
var p = new DialogParameters { ["ContentText"] = $"Are you sure you want to delete expense {item.AutoNumber}?" };
var d = await DialogService.ShowAsync<_DeleteConfirmation>("Delete Confirmation", p, new DialogOptions { MaxWidth = MaxWidth.ExtraSmall, FullWidth = true });
var result = await d.Result;
if (result != null && !result.Canceled)
{
if (await CampaignService.DeleteExpenseAsync(item.Id!))
{
Snackbar.Add("Expense removed successfully", Severity.Success);
await OnChanged.InvokeAsync();
}
}
}
}
Features/Pipeline/Campaign/Components/_ExpenseUpdateForm.razor
+100
View File
@@ -0,0 +1,100 @@
@using Indotalent.Features.Pipeline.Campaign.Cqrs
@using MudBlazor
@inject CampaignService CampaignService
@inject ISnackbar Snackbar
<MudDialog>
<DialogContent>
<MudForm @ref="_form" Model="_model">
<MudGrid Spacing="2">
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Expense Title</MudText>
<MudTextField @bind-Value="_model.Title" Required="true" Variant="Variant.Outlined" Margin="Margin.Dense" FullWidth="true" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Amount</MudText>
<MudNumericField @bind-Value="_model.Amount" Variant="Variant.Outlined" Margin="Margin.Dense" T="decimal?" HideSpinButtons="true" FullWidth="true" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Date</MudText>
<MudDatePicker @bind-Date="_model.ExpenseDate" Variant="Variant.Outlined" Margin="Margin.Dense" />
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Status</MudText>
<MudSelect T="Indotalent.Data.Enums.ExpenseStatus" @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.ExpenseStatuses)
{
<MudSelectItem Value="@((Indotalent.Data.Enums.ExpenseStatus)item.Value)">@item.Name</MudSelectItem>
}
</MudSelect>
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.subtitle2" Class="mb-1">Description</MudText>
<MudTextField @bind-Value="_model.Description" Variant="Variant.Outlined" Margin="Margin.Dense" Lines="2" FullWidth="true" />
</MudItem>
</MudGrid>
</MudForm>
</DialogContent>
<DialogActions>
<MudButton OnClick="Cancel" Variant="Variant.Text" Style="text-transform: none; font-weight: 700;">Cancel</MudButton>
<MudButton Color="Color.Primary" OnClick="Submit" Variant="Variant.Filled" Disabled="_processing" Style="border-radius: 4px; text-transform: none; font-weight: 700;">
@if (_processing)
{
<MudProgressCircular Size="Size.Small" Indeterminate="true" />
<MudText Class="ms-2" Typo="Typo.button" Style="text-transform: none !important;">Processing...</MudText>
}
else
{
<MudText>Save Changes</MudText>
}
</MudButton>
</DialogActions>
</MudDialog>
@code {
[CascadingParameter] IMudDialogInstance MudDialog { get; set; } = default!;
[Parameter] public CampaignExpenseResponse Data { get; set; } = new();
[Parameter] public CampaignLookupResponse Lookup { get; set; } = new();
private MudForm _form = default!;
private UpdateExpenseRequest _model = new();
private bool _processing = false;
protected override void OnInitialized()
{
_model.Id = Data.Id;
_model.Title = Data.Title;
_model.Amount = Data.Amount;
_model.ExpenseDate = Data.ExpenseDate;
_model.Status = Data.Status;
_model.Description = Data.Description;
}
private void Cancel() => MudDialog.Cancel();
private async Task Submit()
{
await _form.Validate();
if (!_form.IsValid) return;
_processing = true;
try
{
var res = await CampaignService.UpdateExpenseAsync(_model);
await Task.Delay(500);
if (res != null && res.IsSuccess)
{
Snackbar.Add("Expense updated successfully", Severity.Success);
MudDialog.Close(DialogResult.Ok(true));
}
}
catch (Exception ex)
{
Snackbar.Add($"Error: {ex.Message}", Severity.Error);
}
finally
{
_processing = false;
}
}
}