datagrid rest

ComponentPractice/ComponentPractice/Components/Layout/NavMenu.razor

@@ -61,6 +61,12 @@
                 <RadzenIcon Icon="assignment" class="bi" aria-hidden="true"></RadzenIcon>&nbsp;&nbsp;DataGrid Adv.
             </NavLink>
         </div>
+
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="datagridrest">
+                <RadzenIcon Icon="assignment" class="bi" aria-hidden="true"></RadzenIcon>&nbsp;&nbsp;DataGrid REST
+            </NavLink>
+        </div>
     </nav>
 </div>
 

ComponentPractice/ComponentPractice/Components/Pages/DataGridREST.razor

@@ -0,0 +1,71 @@
+@page "/datagridrest"
+@using ComponentPractice.Services
+@using System.Linq.Dynamic.Core
+
+@inject NorthwindDataService service;
+
+@rendermode RenderMode.InteractiveServer
+
+<RadzenCard class="rz-p-12" Style="width: 900px">
+    <RadzenText TextStyle="TextStyle.H5">DataGrid <strong>REST</strong></RadzenText>
+    <RadzenButton Text="Reset" Click="@Reset" Style="margin-bottom: 20px" />
+
+    <RadzenDataGrid @ref="grid" Data="@customers" IsLoading="@isLoading" Count="@count" LoadData="@LoadData"
+        SelectionMode="DataGridSelectionMode.Single"
+        AllowPaging="true" PageSize="@PAGE_SIZE" PagerHorizontalAlign="HorizontalAlign.Center" ShowPagingSummary="true"
+        AllowFiltering="true" AllowColumnResize="true" AllowAlternatingRows="false" FilterMode="FilterMode.CheckBoxList" AllowSorting="true">
+        <Columns>
+            <RadzenDataGridColumn Property="@nameof(Customer.CustomerID)" Filterable="false" Title="ID" Frozen="true" Width="80px" TextAlign="TextAlign.Center" />
+            <RadzenDataGridColumn Property="@nameof(Customer.CompanyName)" Filterable="true" Title="Company" Frozen="true" Width="240px" TextAlign="TextAlign.Center" />
+            <RadzenDataGridColumn Property="@nameof(Customer.ContactTitle)" Filterable="true" Title="Contact" Width="320px" TextAlign="TextAlign.Center" />
+            <RadzenDataGridColumn Property="@nameof(Customer.Address)" Filterable="true" Title="Address" Width="240px" TextAlign="TextAlign.Center" />
+            <RadzenDataGridColumn Property="@nameof(Customer.City)" Filterable="true" Title="City" Width="160px" TextAlign="TextAlign.Center" />
+            <RadzenDataGridColumn Property="@nameof(Customer.Region)" Filterable="true" Title="Region" Width="160px" TextAlign="TextAlign.Center" />
+            <RadzenDataGridColumn Property="@nameof(Customer.PostalCode)" Filterable="true" Title="PostalCode" Width="160px" TextAlign="TextAlign.Center" />
+            <RadzenDataGridColumn Property="@nameof(Customer.Country)" Filterable="true" Title="Country" Width="160px" TextAlign="TextAlign.Center" />
+            <RadzenDataGridColumn Property="@nameof(Customer.Phone)" Filterable="true" Title="Phone" Width="160px" TextAlign="TextAlign.Center" />
+            <RadzenDataGridColumn Property="@nameof(Customer.Fax)" Filterable="true" Title="Fax" Width="160px" TextAlign="TextAlign.Center" />
+        </Columns>
+    </RadzenDataGrid>
+</RadzenCard>
+
+
+@code {
+    readonly int PAGE_SIZE = 10;
+
+    RadzenDataGrid<Customer> grid;
+    IEnumerable<Customer> customers;
+
+    int count;
+    bool isLoading = false;
+
+    async Task Reset()
+    {
+        grid.Reset(true);
+        await grid.FirstPage(true);
+    }
+
+    async Task LoadData(LoadDataArgs args)
+    {
+        isLoading = true;
+
+        await Task.Yield();
+
+        var result = await service.GetCustomer();
+
+        customers = result.Value;
+        var query = customers.AsQueryable();
+
+        if (!string.IsNullOrEmpty(args.Filter))
+            query = query.Where(args.Filter);
+
+        if (!string.IsNullOrEmpty(args.OrderBy))
+            query = query.OrderBy(args.OrderBy);
+
+        count = query.Count();
+
+        customers = query.Skip(args.Skip.Value).Take(args.Top.Value).ToList();
+
+        isLoading = false;
+    }
+}

ComponentPractice/ComponentPractice/Models/Customer.cs

@@ -0,0 +1,17 @@
+namespace ComponentPractice.Models
+{
+    public class Customer
+    {
+        public string CustomerID { get; set; }
+        public string CompanyName { get; set; }
+        public string ContactName { get; set; }
+        public string ContactTitle { get; set; }
+        public string Address { get; set; }
+        public string City { get; set; }
+        public string Region { get; set; }
+        public string PostalCode { get; set; }
+        public string Country { get; set; }
+        public string Phone { get; set; }
+        public string Fax { get; set; }
+    }
+}

ComponentPractice/ComponentPractice/Program.cs

@@ -1,5 +1,6 @@
 using ComponentPractice.Components;
 using ComponentPractice.Data;
+using ComponentPractice.Services;
 using Radzen;
 
 namespace ComponentPractice
@@ -17,6 +18,7 @@ namespace ComponentPractice
             builder.Services.AddRadzenComponents();
 
             builder.Services.AddScoped<InMemoryData>();
+            builder.Services.AddScoped<NorthwindDataService>();
 
             var app = builder.Build();
 

ComponentPractice/ComponentPractice/Services/NorthwindDataService.cs

@@ -0,0 +1,27 @@
+using ComponentPractice.Models;
+using Radzen;
+
+namespace ComponentPractice.Services
+{
+    public class NorthwindDataService
+    {
+        private readonly HttpClient httpClient;
+        private readonly Uri baseUri;
+
+        public NorthwindDataService(string url = "https://services.radzen.com/odata/Northwind/")
+        {
+            baseUri = new Uri(url);
+            httpClient = new HttpClient();
+        }
+
+        public async Task<ODataServiceResult<Customer>> GetCustomer()
+        {
+            var uri = new Uri(baseUri, "Customers");
+            var httpRequestMessage = new HttpRequestMessage(HttpMethod.Get, uri);
+
+            var response = await httpClient.SendAsync(httpRequestMessage);
+
+            return await response.ReadAsync<ODataServiceResult<Customer>>();
+        }
+    }
+}