WatchList.MudBlazor - Add "FilterModel" and used it in the project.

WatchList.MudBlazors/Model/FilterModel.cs

@@ -0,0 +1,28 @@
+using System.Collections.ObjectModel;
+using Microsoft.AspNetCore.Components;
+using WatchList.Core.Model.Filter;
+using WatchList.Core.Model.Filter.Components;
+
+namespace WatchList.MudBlazors.Model
+{
+    public class FilterModel
+    {
+        public ObservableCollection<TypeFilter> TypeItem { get; set; } = new ObservableCollection<TypeFilter>(TypeFilter.List);
+
+        public ObservableCollection<StatusFilter> StatusItem { get; set; } = new ObservableCollection<StatusFilter>(StatusFilter.List);
+
+        [Parameter]
+        public TypeFilter Type { get; set; } = TypeFilter.AllCinema;
+
+        [Parameter]
+        public StatusFilter Status { get; set; } = StatusFilter.AllCinema;
+
+        public FilterItem GetFilter() => new FilterItem(Type, Status);
+
+        public void Clear()
+        {
+            Type = TypeFilter.AllCinema;
+            Status = StatusFilter.AllCinema;
+        }
+    }
+}

WatchList.MudBlazors/Model/SortModel.cs

@@ -0,0 +1,16 @@
+using System.Collections.ObjectModel;
+using WatchList.Core.Model.Sorting;
+
+namespace WatchList.MudBlazors.Model
+{
+    public class SortModel
+    {
+        public ObservableCollection<SortField> Items { get; set; } = new ObservableCollection<SortField>(SortField.List);
+
+        public SortField Type { get; set; } = SortField.Title;
+
+        public SortField GetSortItem() => Type;
+
+        public void Clear() => Type = SortField.Title;
+    }
+}

WatchList.MudBlazors/Pages/WatchCinemaTable.razor

@@ -1,11 +1,44 @@
-@using WatchList.Core.Model.ItemCinema
+@using Bromix.MudBlazor.MaterialDesignIcons
+@using WatchList.Core.Model.Filter.Components
+@using WatchList.Core.Model.ItemCinema
 
 @page "/watchlist"
 
 <MudText Style="text-align:center; font-size:16px; color:navy" Class="mt-6">List Cinema</MudText>
 
 <MudPaper>
 
+    <MudToolBar Style="place-items:end">
+
+        <MudSpacer/>
+
+        <div style="align-items:end">
+            <MudSelect T="TypeFilter" Label="Type" AdornmentIcon="@Icons.Material.Filled.ShortText" Class="mr-2" @bind-Value="Filter.Type">
+                @foreach (var item in Filter.TypeItem.ToList())
+                {
+                    <MudSelectItem T="TypeFilter" Value="@item" />
+                }
+            </MudSelect>
+        </div>
+
+        <div style="align-items:end">
+            <MudSelect T="StatusFilter" Label="Type" AdornmentIcon="@Icons.Material.Filled.ShortText" Class="mr-1" @bind-Value="Filter.Status">
+                @foreach (var item in Filter.StatusItem.ToList())
+                {
+                    <MudSelectItem T="StatusFilter" Value="@item" />
+                }
+            </MudSelect>
+        </div>
+
+        <MudTooltip Text="Use Filter" Placement="Placement.Top">
+            <MudIconButton Icon="@MaterialDesignIcons.Normal.Filter" OnClick="@LoadData" Color="Color.Primary" Variant="Variant.Text" Size="Size.Medium" />
+        </MudTooltip>
+        <MudTooltip Text="Off Filter" Placement="Placement.Top">
+            <MudIconButton Icon="@MaterialDesignIcons.Normal.FilterOff" OnClick="@ClearFilter" Color="Color.Primary" Variant="Variant.Text" Size="Size.Medium" />
+        </MudTooltip>
+
+    </MudToolBar>
+
     <MudToolBar>
 
         <MudSpacer />

WatchList.MudBlazors/Pages/WatchCinemaTable.razor.cs

@@ -30,6 +30,9 @@ public partial class WatchCinemaTable
         private WatchItemSearchRequest _itemsSearchRequest = new WatchItemSearchRequest();
         private PagedList<WatchItem>? _pagedList = null;
 
+        private FilterModel Filter { get; set; } = new FilterModel();
+        private SortModel Sort { get; set; } = new SortModel();
+
         protected override void OnInitialized()
         {
             _itemsSearchRequest = new WatchItemSearchRequest(new FilterItem(), SortField.Title, _pageModel);
@@ -81,6 +84,8 @@ private async Task RemoveItemDialog(Guid id)
 
         private void LoadData()
         {
+            _itemsSearchRequest.Filter = Filter.GetFilter();
+            _itemsSearchRequest.Sort = Sort.GetSortItem();
             _pagedList = WatchItemService.GetPage(_itemsSearchRequest);
             _items = _pagedList.Items;
             StateHasChanged();
@@ -91,5 +96,12 @@ private void OnSelectItems(HashSet<WatchItem> items)
             _selectedItems = items;
             _isSelectItems = _selectedItems.Count <= 0;
         }
+
+        private void ClearFilter()
+        {
+            Filter.Clear();
+            Sort.Clear();
+            LoadData();
+        }
     }
 }