Skip to content

Commit 5d4368c

Browse files
mckaragozmckaragoz
authored
TransferList SearchBox and Title (#234)
1 parent f60f3f2 commit 5d4368c

File tree

3 files changed

+71
-22
lines changed

3 files changed

+71
-22
lines changed

‎CodeBeam.MudBlazor.Extensions/Components/TransferList/MudTransferList.razor‎

Lines changed: 38 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,25 @@
44
@using MudExtensions.Enums
55

66
<MudStack Class="@Class" Style="@Style" Row="!Vertical" Spacing="Spacing">
7-
<MudListExtended @ref="_startList" Class="@StartClassname" Style="@StartStylename" OnDoubleClick="DoubleClick" T="T" ItemCollection="@StartCollection" Disabled="Disabled" Clickable="true" MultiSelection="@MultiSelection" SelectAll="@MultiSelection" MultiSelectionComponent="@MultiSelectionComponent" MaxItems="@MaxItems" Color="@Color" ToStringFunc="ToStringFunc">
8-
<SelectAllTemplate>
9-
@if (SelectAllType == SelectAllType.SelectAllItem)
10-
{
11-
<MudListItemExtended T="T" IsFunctional="true" Text="@SelectAllText" SecondaryText="@($"{(_startList == null ? 0 : _startList.SelectedValues == null ? 0 : _startList.SelectedValues.Count())} / {StartCollection.Count}")" OnClickStopPropagation="false" />
12-
}
13-
</SelectAllTemplate>
14-
</MudListExtended>
7+
<div>
8+
@if (StartTitleContent != null)
9+
{
10+
@StartTitleContent
11+
}
12+
else if (string.IsNullOrEmpty(StartTitle) == false)
13+
{
14+
<MudListItemExtended T="string"><MudText>@StartTitle</MudText></MudListItemExtended>
15+
}
16+
<MudListExtended @ref="_startList" Class="@StartClassname" Style="@StartStylename" SearchBox="SearchBoxStart" OnDoubleClick="DoubleClick" T="T" ItemCollection="@StartCollection" Disabled="Disabled" Clickable="true" MultiSelection="@MultiSelection" SelectAll="@MultiSelection" MultiSelectionComponent="@MultiSelectionComponent" MaxItems="@MaxItems" Color="@Color" ToStringFunc="ToStringFunc">
17+
<SelectAllTemplate>
18+
@if (SelectAllType == SelectAllType.SelectAllItem)
19+
{
20+
<MudListItemExtended T="T" IsFunctional="true" Text="@SelectAllText" SecondaryText="@($"{(_startList == null ? 0 : _startList.SelectedValues == null ? 0 : _startList.SelectedValues.Count())} / {StartCollection.Count}")" OnClickStopPropagation="false" />
21+
}
22+
</SelectAllTemplate>
23+
</MudListExtended>
24+
</div>
25+
1526
<div class="@($"{(Vertical ? "d-flex" : "d-flex flex-column")} gap-{ButtonSpacing} align-center justify-center")">
1627
@if (SelectAllType == SelectAllType.Buttons)
1728
{
@@ -24,12 +35,23 @@
2435
<MudIconButton Icon="@(Vertical ? Icons.Material.Filled.KeyboardDoubleArrowUp : Icons.Material.Filled.KeyboardDoubleArrowLeft)" Disabled="Disabled" Color="@Color" Variant="@ButtonVariant" OnClick="@(() => TransferAll(false))" />
2536
}
2637
</div>
27-
<MudListExtended @ref="_endList" Class="@EndClassname" Style="@EndStylename" OnDoubleClick="DoubleClick" T="T" ItemCollection="@EndCollection" Disabled="Disabled" Clickable="true" MultiSelection="@MultiSelection" SelectAll="@MultiSelection" MultiSelectionComponent="@MultiSelectionComponent" MaxItems="@MaxItems" Color="@Color" ToStringFunc="ToStringFunc">
28-
<SelectAllTemplate>
29-
@if (SelectAllType == SelectAllType.SelectAllItem)
30-
{
31-
<MudListItemExtended T="T" IsFunctional="true" Text="@SelectAllText" SecondaryText="@($"{(_endList == null ? 0 : _endList.SelectedValues == null ? 0 : _endList.SelectedValues.Count())} / {EndCollection.Count}")" OnClickStopPropagation="false" />
32-
}
33-
</SelectAllTemplate>
34-
</MudListExtended>
38+
<div>
39+
@if (EndTitleContent != null)
40+
{
41+
@EndTitleContent
42+
}
43+
else if (string.IsNullOrEmpty(EndTitle) == false)
44+
{
45+
<MudListItemExtended T="string"><MudText>@EndTitle</MudText></MudListItemExtended>
46+
}
47+
<MudListExtended @ref="_endList" Class="@EndClassname" Style="@EndStylename" SearchBox="SearchBoxEnd" OnDoubleClick="DoubleClick" T="T" ItemCollection="@EndCollection" Disabled="Disabled" Clickable="true" MultiSelection="@MultiSelection" SelectAll="@MultiSelection" MultiSelectionComponent="@MultiSelectionComponent" MaxItems="@MaxItems" Color="@Color" ToStringFunc="ToStringFunc">
48+
<SelectAllTemplate>
49+
@if (SelectAllType == SelectAllType.SelectAllItem)
50+
{
51+
<MudListItemExtended T="T" IsFunctional="true" Text="@SelectAllText" SecondaryText="@($"{(_endList == null ? 0 : _endList.SelectedValues == null ? 0 : _endList.SelectedValues.Count())} / {EndCollection.Count}")" OnClickStopPropagation="false" />
52+
}
53+
</SelectAllTemplate>
54+
</MudListExtended>
55+
</div>
56+
3557
</MudStack>

‎CodeBeam.MudBlazor.Extensions/Components/TransferList/MudTransferList.razor.cs‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,12 +76,30 @@ public partial class MudTransferList<T> : MudComponentBase
7676
[Parameter]
7777
public Func<ICollection<T>, ICollection<T>> OrderFunc { get; set; }
7878

79+
[Parameter]
80+
public RenderFragment StartTitleContent { get; set; }
81+
82+
[Parameter]
83+
public RenderFragment EndTitleContent { get; set; }
84+
85+
[Parameter]
86+
public string StartTitle { get; set; }
87+
88+
[Parameter]
89+
public string EndTitle { get; set; }
90+
7991
[Parameter]
8092
public bool Vertical { get; set; }
8193

8294
[Parameter]
8395
public bool Disabled { get; set; }
8496

97+
[Parameter]
98+
public bool SearchBoxStart { get; set; }
99+
100+
[Parameter]
101+
public bool SearchBoxEnd { get; set; }
102+
85103
/// <summary>
86104
/// If true, double click transfers the item. Doesn't have any effect on multitransfer is true.
87105
/// </summary>

‎ComponentViewer.Docs/Pages/Examples/TransferListExample1.razor‎

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,22 +5,27 @@
55
<MudTransferList @ref="_transferList" T="string" @bind-StartCollection="_startCollection" @bind-EndCollection="_endCollection" Vertical="_vertical" Color="_color"
66
StyleListCommon="background-color: var(--mud-palette-background-grey); width: 200px" MultiSelection="_multiSelection" MaxItems="_maxItems" SelectAllType="_selectAllType"
77
PreventTransfer="@(new Func<bool, bool>(CheckTransfer))" OrderFunc="@(_orderOnTransfer == false ? null : new Func<ICollection<string>, ICollection<string>>(OrderMethod))" ButtonVariant="_buttonVariant"
8-
AllowDoubleClick="_allowDoubleClick" />
8+
AllowDoubleClick="_allowDoubleClick" SearchBoxStart="_searchboxStart" SearchBoxEnd="_searchboxEnd"
9+
StartTitle="@_startTitle" EndTitle="@_endTitle" />
910
</MudItem>
1011

1112
<MudItem xs="12" sm="4">
1213
<MudStack Spacing="4">
1314
<MudText><b>Start Collection:</b> @string.Join(", ", _startCollection ?? new List<string>())</MudText>
1415
<MudText><b>End Collection:</b> @string.Join(", ", _endCollection ?? new List<string>())</MudText>
15-
<MudSwitchM3 @bind-Checked="_vertical" Label="Vertical" Color="Color.Primary" />
16-
<MudSwitchM3 @bind-Checked="_multiSelection" Label="MultiSelection" Color="Color.Primary" />
17-
<MudSwitchM3 @bind-Checked="_preventTurkeyTransfer" Label="Prevent Transfer If Turkey Selected" Color="Color.Primary" />
18-
<MudSwitchM3 @bind-Checked="_orderOnTransfer" Label="Order on Transfer" Color="Color.Primary" />
19-
<MudSwitchM3 @bind-Checked="_allowDoubleClick" Label="Allow Double Click" Color="Color.Primary" />
16+
<MudSwitchM3 @bind-Checked="_vertical" Label="Vertical" Color="Color.Secondary" />
17+
<MudSwitchM3 @bind-Checked="_multiSelection" Label="MultiSelection" Color="Color.Secondary" />
18+
<MudSwitchM3 @bind-Checked="_preventTurkeyTransfer" Label="Prevent Transfer If Turkey Selected" Color="Color.Secondary" />
19+
<MudSwitchM3 @bind-Checked="_orderOnTransfer" Label="Order on Transfer" Color="Color.Secondary" />
20+
<MudSwitchM3 @bind-Checked="_allowDoubleClick" Label="Allow Double Click" Color="Color.Secondary" />
21+
<MudSwitchM3 @bind-Checked="_searchboxStart" Label="SearchBox Start" Color="Color.Secondary" />
22+
<MudSwitchM3 @bind-Checked="_searchboxEnd" Label="SearchBox End" Color="Color.Secondary" />
2023
<MudNumericField @bind-Value="_maxItems" Clearable="true" Label="MaxItems" Variant="Variant.Outlined" Margin="Margin.Dense" />
2124
<MudSelectExtended @bind-Value="_selectAllType" ItemCollection="@(Enum.GetValues<SelectAllType>())" Label="SelectAll Type" Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" />
2225
<MudSelectExtended @bind-Value="_color" ItemCollection="@(Enum.GetValues<Color>())" Label="Color" Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" />
2326
<MudSelectExtended @bind-Value="_buttonVariant" ItemCollection="@(Enum.GetValues<Variant>())" Label="Button Variant" Variant="Variant.Outlined" Margin="Margin.Dense" Dense="true" />
27+
<MudTextFieldExtended @bind-Value="_startTitle" Label="Start Title" Variant="Variant.Outlined" Immediate="true" />
28+
<MudTextFieldExtended @bind-Value="_endTitle" Label="End Title" Variant="Variant.Outlined" Immediate="true" />
2429
</MudStack>
2530
</MudItem>
2631
</MudGrid>
@@ -35,10 +40,14 @@
3540
bool _preventTurkeyTransfer;
3641
bool _orderOnTransfer;
3742
bool _allowDoubleClick;
43+
bool _searchboxStart;
44+
bool _searchboxEnd;
3845
int? _maxItems;
3946
SelectAllType _selectAllType = SelectAllType.Buttons;
4047
Color _color = Color.Primary;
4148
Variant _buttonVariant = Variant.Text;
49+
string _startTitle = "Country Group 1";
50+
string _endTitle = "Country Group 2";
4251

4352
private bool CheckTransfer(bool startToEnd)
4453
{

0 commit comments

Comments
 (0)