AppStd/DbFirst
8
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add operator selection to grid filter rows for dates/numbers

Browse Source 
Introduce custom filter row cell templates for date and numeric columns in CatalogsGrid and MassDataGrid. Users can now select a filter operator (e.g., =, <, >, <=, >=) alongside the filter value for columns like AddedWhen, ChangedWhen, and Amount. Updated filter criteria logic to support these operators using DevExpress expressions. Added new CSS for filter row alignment and appearance. Removed obsolete methods and improved layout logic. This enhances filtering flexibility and user experience in both grids.
This commit is contained in:
OlgunR
2026-02-09 16:10:16 +01:00
parent 8824492057
commit 8387b71676
4 changed files with 665 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

164
DbFirst.BlazorWasm/Components/CatalogsGrid.razor
View File

@@ -3,6 +3,7 @@
@using Microsoft.AspNetCore.Components.Rendering
@using Microsoft.AspNetCore.Components.Forms
@using DevExpress.Blazor
@using DevExpress.Data.Filtering
@inject CatalogApiClient Api
@inject LayoutApiClient LayoutApi
@inject IJSRuntime JsRuntime
@@ -73,6 +74,21 @@
.band-columns {
max-width: 720px;
}
.filter-row-cell {
display: flex;
align-items: center;
gap: 4px;
flex-wrap: wrap;
}
.filter-operator {
width: 52px;
min-width: 52px;
flex: 0 0 52px;
}
.filter-value {
min-width: 140px;
flex: 1 1 140px;
}
</style>
@if (!string.IsNullOrWhiteSpace(errorMessage))
@@ -186,6 +202,10 @@ else
private ValidationMessageStore? validationMessageStore;
private IGrid? gridRef;
private string popupHeaderText = "Edit";
private DateTime? addedWhenFilterValue;
private string addedWhenFilterOperator = "=";
private DateTime? changedWhenFilterValue;
private string changedWhenFilterOperator = "=";
private const string LayoutType = "GRID_BANDS";
private const string LayoutKey = "CatalogsGrid";
private const string LayoutUserStorageKey = "layoutUser";
@@ -212,8 +232,16 @@ else
new() { Value = 1, Text = "PRTBMY_CATALOG_SAVE" }
};
private bool CanSaveBandLayout => !string.IsNullOrWhiteSpace(layoutUser);
private readonly List<FilterOperatorOption> filterOperators = new()
{
new() { Value = "=", Text = "=" },
new() { Value = "<", Text = "<" },
new() { Value = ">", Text = ">" },
new() { Value = "<=", Text = "<=" },
new() { Value = ">=", Text = ">=" }
};
private bool CanSaveBandLayout => !string.IsNullOrWhiteSpace(layoutUser);
private bool gridLayoutApplied;
protected override async Task OnInitializedAsync()
@@ -554,49 +582,6 @@ else
columnLookup = columnDefinitions.ToDictionary(column => column.FieldName, StringComparer.OrdinalIgnoreCase);
}
private void ApplyBandOrderingFromColumnOrder()
{
if (bandLayout.ColumnOrder.Count == 0)
{
return;
}
var bandById = bandLayout.Bands.ToDictionary(band => band.Id, StringComparer.OrdinalIgnoreCase);
var orderedBandIds = new List<string>();
var orderedColumnsByBand = bandLayout.Bands.ToDictionary(
band => band.Id,
_ => new List<string>(),
StringComparer.OrdinalIgnoreCase);
foreach (var field in bandLayout.ColumnOrder)
{
if (columnBandAssignments.TryGetValue(field, out var bandId) && bandById.ContainsKey(bandId))
{
if (!orderedBandIds.Contains(bandId, StringComparer.OrdinalIgnoreCase))
{
orderedBandIds.Add(bandId);
}
orderedColumnsByBand[bandId].Add(field);
}
}
foreach (var band in bandLayout.Bands)
{
var orderedColumns = orderedColumnsByBand[band.Id];
orderedColumns.AddRange(band.Columns.Where(column => !orderedColumns.Contains(column, StringComparer.OrdinalIgnoreCase)));
band.Columns = orderedColumns;
}
if (orderedBandIds.Count > 0)
{
bandLayout.Bands = orderedBandIds
.Select(id => bandById[id])
.Concat(bandLayout.Bands.Where(band => !orderedBandIds.Contains(band.Id, StringComparer.OrdinalIgnoreCase)))
.ToList();
}
}
private void AddBand()
{
bandLayout.Bands.Add(new BandDefinition
@@ -760,22 +745,95 @@ else
builder.AddAttribute(seq++, "ReadOnly", true);
}
if (string.Equals(column.FieldName, nameof(CatalogReadDto.AddedWhen), StringComparison.OrdinalIgnoreCase))
{
builder.AddAttribute(seq++, "FilterRowCellTemplate", BuildAddedWhenFilterTemplate());
}
else if (string.Equals(column.FieldName, nameof(CatalogReadDto.ChangedWhen), StringComparison.OrdinalIgnoreCase))
{
builder.AddAttribute(seq++, "FilterRowCellTemplate", BuildChangedWhenFilterTemplate());
}
builder.CloseComponent();
}
private RenderFragment? BuildFilterTemplate(ColumnDefinition column)
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildAddedWhenFilterTemplate()
{
return null;
return BuildDateFilterTemplate(
() => addedWhenFilterValue,
value => addedWhenFilterValue = value,
() => addedWhenFilterOperator,
value => addedWhenFilterOperator = value);
}
private RenderFragment? BuildTextFilterTemplate()
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildChangedWhenFilterTemplate()
{
return null;
return BuildDateFilterTemplate(
() => changedWhenFilterValue,
value => changedWhenFilterValue = value,
() => changedWhenFilterOperator,
value => changedWhenFilterOperator = value);
}
private RenderFragment? BuildDateFilterTemplate()
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildDateFilterTemplate(
Func<DateTime?> getValue,
Action<DateTime?> setValue,
Func<string> getOperator,
Action<string> setOperator)
{
return null;
return context => builder =>
{
var seq = 0;
builder.OpenElement(seq++, "div");
builder.AddAttribute(seq++, "class", "filter-row-cell");
builder.OpenComponent<DxComboBox<FilterOperatorOption, string>>(seq++);
builder.AddAttribute(seq++, "Data", filterOperators);
builder.AddAttribute(seq++, "TextFieldName", "Text");
builder.AddAttribute(seq++, "ValueFieldName", "Value");
builder.AddAttribute(seq++, "Value", getOperator());
builder.AddAttribute(seq++, "ValueChanged", EventCallback.Factory.Create<string>(this, value =>
{
setOperator(value);
UpdateFilterCriteria(context, value, getValue());
}));
builder.AddAttribute(seq++, "CssClass", "filter-operator");
builder.CloseComponent();
builder.OpenComponent<DxDateEdit<DateTime?>>(seq++);
builder.AddAttribute(seq++, "Date", getValue());
builder.AddAttribute(seq++, "DateChanged", EventCallback.Factory.Create<DateTime?>(this, value =>
{
setValue(value);
UpdateFilterCriteria(context, getOperator(), value);
}));
builder.AddAttribute(seq++, "ClearButtonDisplayMode", DataEditorClearButtonDisplayMode.Auto);
builder.AddAttribute(seq++, "CssClass", "filter-value");
builder.CloseComponent();
builder.CloseElement();
};
}
private void UpdateFilterCriteria(GridDataColumnFilterRowCellTemplateContext context, string op, DateTime? value)
{
if (!value.HasValue)
{
context.FilterCriteria = null;
return;
}
var prop = new OperandProperty(context.DataColumn.FieldName);
var date = value.Value.Date;
context.FilterCriteria = op switch
{
"=" => new GroupOperator(GroupOperatorType.And, prop >= date, prop < date.AddDays(1)),
"<" => prop < date,
"<=" => prop < date.AddDays(1),
">" => prop >= date.AddDays(1),
">=" => prop >= date,
_ => prop == date
};
}
private sealed class BandLayout
@@ -830,4 +888,10 @@ else
public int Value { get; set; }
public string Text { get; set; } = string.Empty;
}
private sealed class FilterOperatorOption
{
public string Value { get; set; } = string.Empty;
public string Text { get; set; } = string.Empty;
}
}

197
DbFirst.BlazorWasm/Components/MassDataGrid.razor
View File

@@ -3,6 +3,7 @@
@using Microsoft.AspNetCore.Components.Rendering
@using Microsoft.AspNetCore.Components.Forms
@using DevExpress.Blazor
@using DevExpress.Data.Filtering
@inject MassDataApiClient Api
@inject LayoutApiClient LayoutApi
@inject IJSRuntime JsRuntime
@@ -96,6 +97,25 @@
.band-columns {
max-width: 720px;
}
.filter-row-cell {
display: flex;
align-items: center;
gap: 4px;
flex-wrap: wrap;
}
.filter-operator {
width: 52px;
min-width: 52px;
flex: 0 0 52px;
}
.filter-value {
min-width: 140px;
flex: 1 1 140px;
}
.filter-value-amount {
min-width: 110px;
flex-basis: 110px;
}
</style>
@if (!string.IsNullOrWhiteSpace(errorMessage))
@@ -234,6 +254,12 @@ else
private int pageCount = 1;
private int? pageSize = 100;
private string popupHeaderText = "Edit";
private decimal? amountFilterValue;
private string amountFilterOperator = "=";
private DateTime? addedWhenFilterValue;
private string addedWhenFilterOperator = "=";
private DateTime? changedWhenFilterValue;
private string changedWhenFilterOperator = "=";
private EditContext? editContext;
private ValidationMessageStore? validationMessageStore;
private IGrid? gridRef;
@@ -280,6 +306,17 @@ else
new() { Value = 0, Text = "PRMassdata_UpsertByCustomerName" }
};
private readonly List<FilterOperatorOption> filterOperators = new()
{
new() { Value = "=", Text = "=" },
new() { Value = "<", Text = "<" },
new() { Value = ">", Text = ">" },
new() { Value = "<=", Text = "<=" },
new() { Value = ">=", Text = ">=" }
};
private bool gridLayoutApplied;
protected override async Task OnInitializedAsync()
{
columnLookup = columnDefinitions.ToDictionary(column => column.FieldName, StringComparer.OrdinalIgnoreCase);
@@ -601,9 +638,163 @@ else
builder.AddAttribute(seq++, "ReadOnly", true);
}
if (string.Equals(column.FieldName, nameof(MassDataReadDto.Amount), StringComparison.OrdinalIgnoreCase))
{
builder.AddAttribute(seq++, "FilterRowCellTemplate", BuildAmountFilterTemplate());
}
else if (string.Equals(column.FieldName, nameof(MassDataReadDto.AddedWhen), StringComparison.OrdinalIgnoreCase))
{
builder.AddAttribute(seq++, "FilterRowCellTemplate", BuildAddedWhenFilterTemplate());
}
else if (string.Equals(column.FieldName, nameof(MassDataReadDto.ChangedWhen), StringComparison.OrdinalIgnoreCase))
{
builder.AddAttribute(seq++, "FilterRowCellTemplate", BuildChangedWhenFilterTemplate());
}
builder.CloseComponent();
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildAmountFilterTemplate()
{
return BuildNumberFilterTemplate(
() => amountFilterValue,
value => amountFilterValue = value,
() => amountFilterOperator,
value => amountFilterOperator = value);
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildAddedWhenFilterTemplate()
{
return BuildDateFilterTemplate(
() => addedWhenFilterValue,
value => addedWhenFilterValue = value,
() => addedWhenFilterOperator,
value => addedWhenFilterOperator = value);
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildChangedWhenFilterTemplate()
{
return BuildDateFilterTemplate(
() => changedWhenFilterValue,
value => changedWhenFilterValue = value,
() => changedWhenFilterOperator,
value => changedWhenFilterOperator = value);
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildNumberFilterTemplate(
Func<decimal?> getValue,
Action<decimal?> setValue,
Func<string> getOperator,
Action<string> setOperator)
{
return context => builder =>
{
var seq = 0;
builder.OpenElement(seq++, "div");
builder.AddAttribute(seq++, "class", "filter-row-cell");
builder.OpenComponent<DxComboBox<FilterOperatorOption, string>>(seq++);
builder.AddAttribute(seq++, "Data", filterOperators);
builder.AddAttribute(seq++, "TextFieldName", "Text");
builder.AddAttribute(seq++, "ValueFieldName", "Value");
builder.AddAttribute(seq++, "Value", getOperator());
builder.AddAttribute(seq++, "ValueChanged", EventCallback.Factory.Create<string>(this, value =>
{
setOperator(value);
UpdateFilterCriteria(context, value, getValue());
}));
builder.AddAttribute(seq++, "CssClass", "filter-operator");
builder.CloseComponent();
builder.OpenComponent<DxSpinEdit<decimal?>>(seq++);
builder.AddAttribute(seq++, "Value", getValue());
builder.AddAttribute(seq++, "ValueChanged", EventCallback.Factory.Create<decimal?>(this, value =>
{
setValue(value);
UpdateFilterCriteria(context, getOperator(), value);
}));
builder.AddAttribute(seq++, "ClearButtonDisplayMode", DataEditorClearButtonDisplayMode.Auto);
builder.AddAttribute(seq++, "CssClass", "filter-value filter-value-amount");
builder.CloseComponent();
builder.CloseElement();
};
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildDateFilterTemplate(
Func<DateTime?> getValue,
Action<DateTime?> setValue,
Func<string> getOperator,
Action<string> setOperator)
{
return context => builder =>
{
var seq = 0;
builder.OpenElement(seq++, "div");
builder.AddAttribute(seq++, "class", "filter-row-cell");
builder.OpenComponent<DxComboBox<FilterOperatorOption, string>>(seq++);
builder.AddAttribute(seq++, "Data", filterOperators);
builder.AddAttribute(seq++, "TextFieldName", "Text");
builder.AddAttribute(seq++, "ValueFieldName", "Value");
builder.AddAttribute(seq++, "Value", getOperator());
builder.AddAttribute(seq++, "ValueChanged", EventCallback.Factory.Create<string>(this, value =>
{
setOperator(value);
UpdateFilterCriteria(context, value, getValue());
}));
builder.AddAttribute(seq++, "CssClass", "filter-operator");
builder.CloseComponent();
builder.OpenComponent<DxDateEdit<DateTime?>>(seq++);
builder.AddAttribute(seq++, "Date", getValue());
builder.AddAttribute(seq++, "DateChanged", EventCallback.Factory.Create<DateTime?>(this, value =>
{
setValue(value);
UpdateFilterCriteria(context, getOperator(), value);
}));
builder.AddAttribute(seq++, "ClearButtonDisplayMode", DataEditorClearButtonDisplayMode.Auto);
builder.AddAttribute(seq++, "CssClass", "filter-value");
builder.CloseComponent();
builder.CloseElement();
};
}
private void UpdateFilterCriteria(GridDataColumnFilterRowCellTemplateContext context, string op, object? value)
{
if (value == null)
{
context.FilterCriteria = null;
return;
}
var prop = new OperandProperty(context.DataColumn.FieldName);
if (value is DateTime dateValue)
{
var date = dateValue.Date;
context.FilterCriteria = op switch
{
"=" => new GroupOperator(GroupOperatorType.And, prop >= date, prop < date.AddDays(1)),
"<" => prop < date,
"<=" => prop < date.AddDays(1),
">" => prop >= date.AddDays(1),
">=" => prop >= date,
_ => prop == date
};
return;
}
context.FilterCriteria = op switch
{
"<" => new BinaryOperator(prop, new OperandValue(value), BinaryOperatorType.Less),
">" => new BinaryOperator(prop, new OperandValue(value), BinaryOperatorType.Greater),
"<=" => new BinaryOperator(prop, new OperandValue(value), BinaryOperatorType.LessOrEqual),
">=" => new BinaryOperator(prop, new OperandValue(value), BinaryOperatorType.GreaterOrEqual),
_ => new BinaryOperator(prop, new OperandValue(value), BinaryOperatorType.Equal)
};
}
private void SetEditContext(EditContext context)
{
if (editContext == context)
@@ -808,7 +999,11 @@ else
public string Text { get; set; } = string.Empty;
}
private bool gridLayoutApplied;
private sealed class FilterOperatorOption
{
public string Value { get; set; } = string.Empty;
public string Text { get; set; } = string.Empty;
}
protected override async Task OnAfterRenderAsync(bool firstRender)
{

194
DbFirst.BlazorWebApp/Components/CatalogsGrid.razor
View File

@@ -3,6 +3,7 @@
@using Microsoft.AspNetCore.Components.Rendering
@using Microsoft.AspNetCore.Components.Forms
@using DevExpress.Blazor
@using DevExpress.Data.Filtering
@inject CatalogApiClient Api
@inject LayoutApiClient LayoutApi
@inject IJSRuntime JsRuntime
@@ -32,6 +33,21 @@
.band-columns {
max-width: 720px;
}
.filter-row-cell {
display: flex;
align-items: center;
gap: 4px;
flex-wrap: wrap;
}
.filter-operator {
width: 52px;
min-width: 52px;
flex: 0 0 52px;
}
.filter-value {
min-width: 140px;
flex: 1 1 140px;
}
</style>
@if (!string.IsNullOrWhiteSpace(errorMessage))
@@ -145,6 +161,10 @@ else
private ValidationMessageStore? validationMessageStore;
private IGrid? gridRef;
private string popupHeaderText = "Edit";
private DateTime? addedWhenFilterValue;
private string addedWhenFilterOperator = "=";
private DateTime? changedWhenFilterValue;
private string changedWhenFilterOperator = "=";
private const string LayoutType = "GRID_BANDS";
private const string LayoutKey = "CatalogsGrid";
private const string LayoutUserStorageKey = "layoutUser";
@@ -171,7 +191,17 @@ else
new() { Value = 1, Text = "PRTBMY_CATALOG_SAVE" }
};
private readonly List<FilterOperatorOption> filterOperators = new()
{
new() { Value = "=", Text = "=" },
new() { Value = "<", Text = "<" },
new() { Value = ">", Text = ">" },
new() { Value = "<=", Text = "<=" },
new() { Value = ">=", Text = ">=" }
};
private bool CanSaveBandLayout => !string.IsNullOrWhiteSpace(layoutUser);
private bool gridLayoutApplied;
protected override async Task OnInitializedAsync()
{
@@ -181,6 +211,16 @@ else
await LoadCatalogs();
}
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (!gridLayoutApplied && gridRef != null && bandLayout.GridLayout != null)
{
gridRef.LoadLayout(bandLayout.GridLayout);
gridLayoutApplied = true;
await InvokeAsync(StateHasChanged);
}
}
private void SetEditContext(EditContext context)
{
if (editContext == context)
@@ -474,6 +514,33 @@ else
UpdateBandOptions();
}
private async Task ResetBandLayoutAsync()
{
if (string.IsNullOrWhiteSpace(layoutUser))
{
return;
}
await LayoutApi.DeleteAsync(LayoutType, LayoutKey, layoutUser);
bandLayout = new BandLayout();
columnBandAssignments.Clear();
UpdateBandOptions();
infoMessage = "Band-Layout zurückgesetzt.";
}
private void ApplyColumnLayoutFromStorage()
{
foreach (var column in columnDefinitions)
{
if (bandLayout.ColumnWidths.TryGetValue(column.FieldName, out var width) && !string.IsNullOrWhiteSpace(width))
{
column.Width = width;
}
}
columnLookup = columnDefinitions.ToDictionary(column => column.FieldName, StringComparer.OrdinalIgnoreCase);
}
private void AddBand()
{
bandLayout.Bands.Add(new BandDefinition
@@ -637,9 +704,97 @@ else
builder.AddAttribute(seq++, "ReadOnly", true);
}
if (string.Equals(column.FieldName, nameof(CatalogReadDto.AddedWhen), StringComparison.OrdinalIgnoreCase))
{
builder.AddAttribute(seq++, "FilterRowCellTemplate", BuildAddedWhenFilterTemplate());
}
else if (string.Equals(column.FieldName, nameof(CatalogReadDto.ChangedWhen), StringComparison.OrdinalIgnoreCase))
{
builder.AddAttribute(seq++, "FilterRowCellTemplate", BuildChangedWhenFilterTemplate());
}
builder.CloseComponent();
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildAddedWhenFilterTemplate()
{
return BuildDateFilterTemplate(
() => addedWhenFilterValue,
value => addedWhenFilterValue = value,
() => addedWhenFilterOperator,
value => addedWhenFilterOperator = value);
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildChangedWhenFilterTemplate()
{
return BuildDateFilterTemplate(
() => changedWhenFilterValue,
value => changedWhenFilterValue = value,
() => changedWhenFilterOperator,
value => changedWhenFilterOperator = value);
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildDateFilterTemplate(
Func<DateTime?> getValue,
Action<DateTime?> setValue,
Func<string> getOperator,
Action<string> setOperator)
{
return context => builder =>
{
var seq = 0;
builder.OpenElement(seq++, "div");
builder.AddAttribute(seq++, "class", "filter-row-cell");
builder.OpenComponent<DxComboBox<FilterOperatorOption, string>>(seq++);
builder.AddAttribute(seq++, "Data", filterOperators);
builder.AddAttribute(seq++, "TextFieldName", "Text");
builder.AddAttribute(seq++, "ValueFieldName", "Value");
builder.AddAttribute(seq++, "Value", getOperator());
builder.AddAttribute(seq++, "ValueChanged", EventCallback.Factory.Create<string>(this, value =>
{
setOperator(value);
UpdateFilterCriteria(context, value, getValue());
}));
builder.AddAttribute(seq++, "CssClass", "filter-operator");
builder.CloseComponent();
builder.OpenComponent<DxDateEdit<DateTime?>>(seq++);
builder.AddAttribute(seq++, "Date", getValue());
builder.AddAttribute(seq++, "DateChanged", EventCallback.Factory.Create<DateTime?>(this, value =>
{
setValue(value);
UpdateFilterCriteria(context, getOperator(), value);
}));
builder.AddAttribute(seq++, "ClearButtonDisplayMode", DataEditorClearButtonDisplayMode.Auto);
builder.AddAttribute(seq++, "CssClass", "filter-value");
builder.CloseComponent();
builder.CloseElement();
};
}
private void UpdateFilterCriteria(GridDataColumnFilterRowCellTemplateContext context, string op, DateTime? value)
{
if (!value.HasValue)
{
context.FilterCriteria = null;
return;
}
var prop = new OperandProperty(context.DataColumn.FieldName);
var date = value.Value.Date;
context.FilterCriteria = op switch
{
"=" => new GroupOperator(GroupOperatorType.And, prop >= date, prop < date.AddDays(1)),
"<" => prop < date,
"<=" => prop < date.AddDays(1),
">" => prop >= date.AddDays(1),
">=" => prop >= date,
_ => prop == date
};
}
private sealed class BandLayout
{
public List<BandDefinition> Bands { get; set; } = new();
@@ -693,42 +848,9 @@ else
public string Text { get; set; } = string.Empty;
}
private async Task ResetBandLayoutAsync()
private sealed class FilterOperatorOption
{
if (string.IsNullOrWhiteSpace(layoutUser))
{
return;
}
await LayoutApi.DeleteAsync(LayoutType, LayoutKey, layoutUser);
bandLayout = new BandLayout();
columnBandAssignments.Clear();
UpdateBandOptions();
infoMessage = "Band-Layout zurückgesetzt.";
}
private void ApplyColumnLayoutFromStorage()
{
foreach (var column in columnDefinitions)
{
if (bandLayout.ColumnWidths.TryGetValue(column.FieldName, out var width) && !string.IsNullOrWhiteSpace(width))
{
column.Width = width;
}
}
columnLookup = columnDefinitions.ToDictionary(column => column.FieldName, StringComparer.OrdinalIgnoreCase);
}
private bool gridLayoutApplied;
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (!gridLayoutApplied && gridRef != null && bandLayout.GridLayout != null)
{
gridRef.LoadLayout(bandLayout.GridLayout);
gridLayoutApplied = true;
await InvokeAsync(StateHasChanged);
}
public string Value { get; set; } = string.Empty;
public string Text { get; set; } = string.Empty;
}
}

243
DbFirst.BlazorWebApp/Components/MassDataGrid.razor
View File

@@ -3,6 +3,7 @@
@using Microsoft.AspNetCore.Components.Rendering
@using Microsoft.AspNetCore.Components.Forms
@using DevExpress.Blazor
@using DevExpress.Data.Filtering
@inject MassDataApiClient Api
@inject LayoutApiClient LayoutApi
@inject IJSRuntime JsRuntime
@@ -96,6 +97,25 @@
.band-columns {
max-width: 720px;
}
.filter-row-cell {
display: flex;
align-items: center;
gap: 4px;
flex-wrap: wrap;
}
.filter-operator {
width: 52px;
min-width: 52px;
flex: 0 0 52px;
}
.filter-value {
min-width: 140px;
flex: 1 1 140px;
}
.filter-value-amount {
min-width: 110px;
flex-basis: 110px;
}
</style>
@if (!string.IsNullOrWhiteSpace(errorMessage))
@@ -234,6 +254,12 @@ else
private int pageCount = 1;
private int? pageSize = 100;
private string popupHeaderText = "Edit";
private decimal? amountFilterValue;
private string amountFilterOperator = "=";
private DateTime? addedWhenFilterValue;
private string addedWhenFilterOperator = "=";
private DateTime? changedWhenFilterValue;
private string changedWhenFilterOperator = "=";
private EditContext? editContext;
private ValidationMessageStore? validationMessageStore;
private IGrid? gridRef;
@@ -280,6 +306,17 @@ else
new() { Value = 0, Text = "PRMassdata_UpsertByCustomerName" }
};
private readonly List<FilterOperatorOption> filterOperators = new()
{
new() { Value = "=", Text = "=" },
new() { Value = "<", Text = "<" },
new() { Value = ">", Text = ">" },
new() { Value = "<=", Text = "<=" },
new() { Value = ">=", Text = ">=" }
};
private bool gridLayoutApplied;
protected override async Task OnInitializedAsync()
{
columnLookup = columnDefinitions.ToDictionary(column => column.FieldName, StringComparer.OrdinalIgnoreCase);
@@ -356,7 +393,6 @@ else
columnBandAssignments = BuildAssignmentsFromLayout(bandLayout);
ApplyColumnLayoutFromStorage();
//ApplyBandOrderingFromColumnOrder();
UpdateBandOptions();
}
@@ -426,49 +462,6 @@ else
infoMessage = "Band-Layout zurückgesetzt.";
}
private void ApplyBandOrderingFromColumnOrder()
{
if (bandLayout.ColumnOrder.Count == 0)
{
return;
}
var bandById = bandLayout.Bands.ToDictionary(band => band.Id, StringComparer.OrdinalIgnoreCase);
var orderedBandIds = new List<string>();
var orderedColumnsByBand = bandLayout.Bands.ToDictionary(
band => band.Id,
_ => new List<string>(),
StringComparer.OrdinalIgnoreCase);
foreach (var field in bandLayout.ColumnOrder)
{
if (columnBandAssignments.TryGetValue(field, out var bandId) && bandById.ContainsKey(bandId))
{
if (!orderedBandIds.Contains(bandId, StringComparer.OrdinalIgnoreCase))
{
orderedBandIds.Add(bandId);
}
orderedColumnsByBand[bandId].Add(field);
}
}
foreach (var band in bandLayout.Bands)
{
var orderedColumns = orderedColumnsByBand[band.Id];
orderedColumns.AddRange(band.Columns.Where(column => !orderedColumns.Contains(column, StringComparer.OrdinalIgnoreCase)));
band.Columns = orderedColumns;
}
if (orderedBandIds.Count > 0)
{
bandLayout.Bands = orderedBandIds
.Select(id => bandById[id])
.Concat(bandLayout.Bands.Where(band => !orderedBandIds.Contains(band.Id, StringComparer.OrdinalIgnoreCase)))
.ToList();
}
}
private void ApplyColumnLayoutFromStorage()
{
foreach (var column in columnDefinitions)
@@ -645,9 +638,163 @@ else
builder.AddAttribute(seq++, "ReadOnly", true);
}
if (string.Equals(column.FieldName, nameof(MassDataReadDto.Amount), StringComparison.OrdinalIgnoreCase))
{
builder.AddAttribute(seq++, "FilterRowCellTemplate", BuildAmountFilterTemplate());
}
else if (string.Equals(column.FieldName, nameof(MassDataReadDto.AddedWhen), StringComparison.OrdinalIgnoreCase))
{
builder.AddAttribute(seq++, "FilterRowCellTemplate", BuildAddedWhenFilterTemplate());
}
else if (string.Equals(column.FieldName, nameof(MassDataReadDto.ChangedWhen), StringComparison.OrdinalIgnoreCase))
{
builder.AddAttribute(seq++, "FilterRowCellTemplate", BuildChangedWhenFilterTemplate());
}
builder.CloseComponent();
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildAmountFilterTemplate()
{
return BuildNumberFilterTemplate(
() => amountFilterValue,
value => amountFilterValue = value,
() => amountFilterOperator,
value => amountFilterOperator = value);
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildAddedWhenFilterTemplate()
{
return BuildDateFilterTemplate(
() => addedWhenFilterValue,
value => addedWhenFilterValue = value,
() => addedWhenFilterOperator,
value => addedWhenFilterOperator = value);
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildChangedWhenFilterTemplate()
{
return BuildDateFilterTemplate(
() => changedWhenFilterValue,
value => changedWhenFilterValue = value,
() => changedWhenFilterOperator,
value => changedWhenFilterOperator = value);
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildNumberFilterTemplate(
Func<decimal?> getValue,
Action<decimal?> setValue,
Func<string> getOperator,
Action<string> setOperator)
{
return context => builder =>
{
var seq = 0;
builder.OpenElement(seq++, "div");
builder.AddAttribute(seq++, "class", "filter-row-cell");
builder.OpenComponent<DxComboBox<FilterOperatorOption, string>>(seq++);
builder.AddAttribute(seq++, "Data", filterOperators);
builder.AddAttribute(seq++, "TextFieldName", "Text");
builder.AddAttribute(seq++, "ValueFieldName", "Value");
builder.AddAttribute(seq++, "Value", getOperator());
builder.AddAttribute(seq++, "ValueChanged", EventCallback.Factory.Create<string>(this, value =>
{
setOperator(value);
UpdateFilterCriteria(context, value, getValue());
}));
builder.AddAttribute(seq++, "CssClass", "filter-operator");
builder.CloseComponent();
builder.OpenComponent<DxSpinEdit<decimal?>>(seq++);
builder.AddAttribute(seq++, "Value", getValue());
builder.AddAttribute(seq++, "ValueChanged", EventCallback.Factory.Create<decimal?>(this, value =>
{
setValue(value);
UpdateFilterCriteria(context, getOperator(), value);
}));
builder.AddAttribute(seq++, "ClearButtonDisplayMode", DataEditorClearButtonDisplayMode.Auto);
builder.AddAttribute(seq++, "CssClass", "filter-value filter-value-amount");
builder.CloseComponent();
builder.CloseElement();
};
}
private RenderFragment<GridDataColumnFilterRowCellTemplateContext> BuildDateFilterTemplate(
Func<DateTime?> getValue,
Action<DateTime?> setValue,
Func<string> getOperator,
Action<string> setOperator)
{
return context => builder =>
{
var seq = 0;
builder.OpenElement(seq++, "div");
builder.AddAttribute(seq++, "class", "filter-row-cell");
builder.OpenComponent<DxComboBox<FilterOperatorOption, string>>(seq++);
builder.AddAttribute(seq++, "Data", filterOperators);
builder.AddAttribute(seq++, "TextFieldName", "Text");
builder.AddAttribute(seq++, "ValueFieldName", "Value");
builder.AddAttribute(seq++, "Value", getOperator());
builder.AddAttribute(seq++, "ValueChanged", EventCallback.Factory.Create<string>(this, value =>
{
setOperator(value);
UpdateFilterCriteria(context, value, getValue());
}));
builder.AddAttribute(seq++, "CssClass", "filter-operator");
builder.CloseComponent();
builder.OpenComponent<DxDateEdit<DateTime?>>(seq++);
builder.AddAttribute(seq++, "Date", getValue());
builder.AddAttribute(seq++, "DateChanged", EventCallback.Factory.Create<DateTime?>(this, value =>
{
setValue(value);
UpdateFilterCriteria(context, getOperator(), value);
}));
builder.AddAttribute(seq++, "ClearButtonDisplayMode", DataEditorClearButtonDisplayMode.Auto);
builder.AddAttribute(seq++, "CssClass", "filter-value");
builder.CloseComponent();
builder.CloseElement();
};
}
private void UpdateFilterCriteria(GridDataColumnFilterRowCellTemplateContext context, string op, object? value)
{
if (value == null)
{
context.FilterCriteria = null;
return;
}
var prop = new OperandProperty(context.DataColumn.FieldName);
if (value is DateTime dateValue)
{
var date = dateValue.Date;
context.FilterCriteria = op switch
{
"=" => new GroupOperator(GroupOperatorType.And, prop >= date, prop < date.AddDays(1)),
"<" => prop < date,
"<=" => prop < date.AddDays(1),
">" => prop >= date.AddDays(1),
">=" => prop >= date,
_ => prop == date
};
return;
}
context.FilterCriteria = op switch
{
"<" => new BinaryOperator(prop, new OperandValue(value), BinaryOperatorType.Less),
">" => new BinaryOperator(prop, new OperandValue(value), BinaryOperatorType.Greater),
"<=" => new BinaryOperator(prop, new OperandValue(value), BinaryOperatorType.LessOrEqual),
">=" => new BinaryOperator(prop, new OperandValue(value), BinaryOperatorType.GreaterOrEqual),
_ => new BinaryOperator(prop, new OperandValue(value), BinaryOperatorType.Equal)
};
}
private void SetEditContext(EditContext context)
{
if (editContext == context)
@@ -783,7 +930,7 @@ else
e.Cancel = true;
return Task.CompletedTask;
}
private sealed class BandLayout
{
public List<BandDefinition> Bands { get; set; } = new();
@@ -852,7 +999,11 @@ else
public string Text { get; set; } = string.Empty;
}
private bool gridLayoutApplied;
private sealed class FilterOperatorOption
{
public string Value { get; set; } = string.Empty;
public string Text { get; set; } = string.Empty;
}
protected override async Task OnAfterRenderAsync(bool firstRender)
{