diff --git a/.gitignore b/.gitignore index 40b8d4b..6e255e2 100644 --- a/.gitignore +++ b/.gitignore @@ -53,3 +53,9 @@ npm-debug.log # OS files .DS_Store Thumbs.db + + +# Others +*.claude +*.mcp.json +e2e \ No newline at end of file diff --git a/BlazorGridExamples/BlazorGridExamples.csproj b/BlazorGridExamples/BlazorGridExamples.csproj index 22be4c6..edeeb61 100644 --- a/BlazorGridExamples/BlazorGridExamples.csproj +++ b/BlazorGridExamples/BlazorGridExamples.csproj @@ -8,7 +8,7 @@ - + diff --git a/BlazorGridExamples/Layout/NavMenu.razor b/BlazorGridExamples/Layout/NavMenu.razor index d76d0bf..acbf0b2 100644 --- a/BlazorGridExamples/Layout/NavMenu.razor +++ b/BlazorGridExamples/Layout/NavMenu.razor @@ -1,19 +1,26 @@ @inject NavigationManager NavigationManager +@inject IJSRuntime JS +@implements IDisposable +@using Microsoft.AspNetCore.Components.Routing +@using Microsoft.JSInterop
-
- @foreach (var tab in Tabs) - { -
-
-
- @tab.Title.ToUpper() + @if (!isFullscreen) + { +
+ @foreach (var tab in Tabs) + { +
+
+
+ @tab.Title.ToUpper() +
-
- } -
+ } +
+ } @if (CurrentTab != null) { @@ -26,22 +33,28 @@
Theme: @CurrentTab.Theme
-
Mode: Light
+
Mode: @CurrentTab.Mode
- - ⬇ - Download - - - - 👁 - View More - - - - @(isFullscreen ? "⊗" : "⛶") - @(isFullscreen ? "Exit Fullscreen" : "Fullscreen") - + + + + Download + + + + + + + View More + + + + + + + @(isFullscreen ? "Exit Fullscreen" : "Fullscreen") + +
@@ -54,6 +67,13 @@ private bool isFullscreen = false; + private const string DownloadSvg = """"""; + private const string ViewMoreSvg = """"""; + private const string FullScreenSvg = """"""; + private const string ExitFullScreenSvg = """"""; + private DotNetObjectReference? _selfRef; + private IgbIcon? iconRef; + private class TabInfo { @@ -61,40 +81,50 @@ public string Title { get; set; } = ""; public string Description { get; set; } = ""; public string Theme { get; set; } = "Bootstrap"; + public string Mode { get; set; } = "Light"; } private List Tabs = new() { new TabInfo { - Key = "erp-inventory", + Key = "inventory", Title = "ERP/Inventory", - Description = "Sample app for ERP/Inventory handling large data volumes using Hierarchical Grid." + Description = "Tracking and managing quantity, location and details of products in stock.", + Theme = "Material", + Mode = "Light" }, new TabInfo { Key = "hr-portal", Title = "Org Chart/HR Portal", - Description = "Example featuring a Tree Grid to manage and display employee information.", - Theme = "Fluent" + Description = "Displaying company's hierarchical structure and showing employees data.", + Theme = "Fluent", + Mode = "Light" }, new TabInfo { - Key = "finance-grid", + Key = "finance", Title = "Financial Portfolio", - Description = "An example app showing assets, profit, and loss analyses with live data updates and high-performance Data Grid." + Description = "Asset tracking, profit and loss analysis, featuring interactive dynamic charts.", + Theme = "Bootstrap", + Mode = "Light" }, new TabInfo { - Key = "sales-grid", + Key = "sales", Title = "Sales Dashboard", - Description = "Sales app example with summaries by region, product, and time periods using Pivot Grid." + Description = "For trend analysis, KPIs and viewing sales summaries by region, product, etc.", + Theme = "Indigo", + Mode = "Light" }, new TabInfo { - Key = "fleet-management", + Key = "fleet", Title = "Fleet Management", - Description = "Sample app with a Master-Detail Grid for managing vehicle acquisition, operations, and maintenance." + Description = "A master-detail grid for managing vehicle acquisition, operations, and maintenance.", + Theme = "Material", + Mode = "Dark" } }; @@ -102,35 +132,80 @@ private bool IsActive(string key) { - var currentPath = new Uri(NavigationManager.Uri).LocalPath; - return currentPath.Contains(key, StringComparison.OrdinalIgnoreCase); + var path = new Uri(NavigationManager.Uri).LocalPath; + var current = path.Contains("/home/", StringComparison.OrdinalIgnoreCase) + ? path.Split("/home/")[^1].TrimEnd('/') + : "inventory"; + return string.Equals(current, key, StringComparison.OrdinalIgnoreCase); } private void NavigateToSample(string key) { - NavigationManager.NavigateTo($"/{key}"); + NavigationManager.NavigateTo($"/home/{key}"); + } + + protected override void OnInitialized() + { + // The NavMenu lives in the layout and isn't re-rendered automatically on route + // changes, so the active tab / current-tab-info would go stale. Re-render on navigation. + NavigationManager.LocationChanged += HandleLocationChanged; + } + + private void HandleLocationChanged(object? sender, LocationChangedEventArgs e) + { + InvokeAsync(StateHasChanged); } private async Task DownloadSample(string key) { - // TODO: Implement download functionality - // This would zip the sample project and download it - await Task.CompletedTask; + await JS.InvokeVoidAsync("shellInterop.download", + "https://github.com/IgniteUI/blazor-grid-examples/archive/refs/heads/master.zip"); + } + + private async Task ViewMore(string key) + { + await JS.InvokeVoidAsync("shellInterop.openTab", + "https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/grids/grid/overview"); + } + + private async Task ToggleFullscreen() + { + // Browser fullscreen is toggled here; isFullscreen is then synced by the + // fullscreenchange listener so pressing Esc also restores the tab strip. + await JS.InvokeVoidAsync("shellInterop.toggleFullscreen"); + } + + protected override async Task OnAfterRenderAsync(bool firstRender) + { + if (firstRender) + { + _selfRef = DotNetObjectReference.Create(this); + await JS.InvokeVoidAsync("shellInterop.registerFullscreenListener", _selfRef); + + if (iconRef is not null) + { + await iconRef.EnsureReady(); + await iconRef.RegisterIconFromTextAsync("file_download", DownloadSvg, "material"); + await iconRef.RegisterIconFromTextAsync("view_more", ViewMoreSvg, "material"); + await iconRef.RegisterIconFromTextAsync("full_screen", FullScreenSvg, "material"); + await iconRef.RegisterIconFromTextAsync("exit_full_screen", ExitFullScreenSvg, "material"); + } + } } - private void ViewMore(string key) + [JSInvokable] + public void OnFullscreenChange(bool isFs) { - // Navigate to documentation or more info - var tab = Tabs.FirstOrDefault(t => t.Key == key); - if (tab != null) + if (isFullscreen != isFs) { - NavigationManager.NavigateTo($"https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/grids/grid/overview", true); + isFullscreen = isFs; + InvokeAsync(StateHasChanged); } } - private void ToggleFullscreen() + public void Dispose() { - isFullscreen = !isFullscreen; - // TODO: Implement actual fullscreen toggle using JS Interop + NavigationManager.LocationChanged -= HandleLocationChanged; + _selfRef?.Dispose(); } } diff --git a/BlazorGridExamples/Pages/ERPInventory.razor b/BlazorGridExamples/Pages/ERPInventory.razor deleted file mode 100644 index 246552e..0000000 --- a/BlazorGridExamples/Pages/ERPInventory.razor +++ /dev/null @@ -1,3 +0,0 @@ -@page "/erp-inventory" - - \ No newline at end of file diff --git a/BlazorGridExamples/Pages/FinanceGrid.razor b/BlazorGridExamples/Pages/FinanceGrid.razor deleted file mode 100644 index 94946d9..0000000 --- a/BlazorGridExamples/Pages/FinanceGrid.razor +++ /dev/null @@ -1,3 +0,0 @@ -@page "/finance-grid" - - \ No newline at end of file diff --git a/BlazorGridExamples/Pages/FleetManagement.razor b/BlazorGridExamples/Pages/FleetManagement.razor deleted file mode 100644 index fb7e4b0..0000000 --- a/BlazorGridExamples/Pages/FleetManagement.razor +++ /dev/null @@ -1,3 +0,0 @@ -@page "/fleet-management" - - \ No newline at end of file diff --git a/BlazorGridExamples/Pages/HRPortal.razor b/BlazorGridExamples/Pages/HRPortal.razor deleted file mode 100644 index 87fb0ad..0000000 --- a/BlazorGridExamples/Pages/HRPortal.razor +++ /dev/null @@ -1,4 +0,0 @@ -@page "/" -@page "/hr-portal" - - \ No newline at end of file diff --git a/BlazorGridExamples/Pages/SalesGrid.razor b/BlazorGridExamples/Pages/SalesGrid.razor deleted file mode 100644 index bbbb187..0000000 --- a/BlazorGridExamples/Pages/SalesGrid.razor +++ /dev/null @@ -1,3 +0,0 @@ -@page "/sales-grid" - - \ No newline at end of file diff --git a/BlazorGridExamples/Pages/SampleHost.razor b/BlazorGridExamples/Pages/SampleHost.razor new file mode 100644 index 0000000..ea9be28 --- /dev/null +++ b/BlazorGridExamples/Pages/SampleHost.razor @@ -0,0 +1,58 @@ +@page "/" +@page "/home" +@page "/home/{Sample?}" + +@* Single host for all five samples. Each sample is lazily mounted the first time its tab is + opened and then kept alive; switching tabs only toggles pane visibility, so the grids are + never destroyed/recreated and every revisit is instant. Lazy (not prewarmed) so background + grid-building never competes with the active view. *@ +
+ @if (_mounted.Contains("inventory")) + { +
+ +
+ } + @if (_mounted.Contains("hr-portal")) + { +
+ +
+ } + @if (_mounted.Contains("finance")) + { +
+ +
+ } + @if (_mounted.Contains("sales")) + { +
+ +
+ } + @if (_mounted.Contains("fleet")) + { +
+ +
+ } +
+ +@code { + [Parameter] public string? Sample { get; set; } + + private static readonly string[] AllKeys = { "inventory", "hr-portal", "finance", "sales", "fleet" }; + private readonly HashSet _mounted = new(); + private string Active = "inventory"; + + private string Hidden(string key) => Active == key ? "" : "sample-pane--hidden"; + + protected override void OnParametersSet() + { + var key = string.IsNullOrWhiteSpace(Sample) ? "inventory" : Sample.Trim().ToLowerInvariant(); + if (!AllKeys.Contains(key)) key = "inventory"; + Active = key; + _mounted.Add(key); // lazily mount the active tab on first visit; it stays mounted after + } +} diff --git a/BlazorGridExamples/Pages/SampleHost.razor.css b/BlazorGridExamples/Pages/SampleHost.razor.css new file mode 100644 index 0000000..2bf51bf --- /dev/null +++ b/BlazorGridExamples/Pages/SampleHost.razor.css @@ -0,0 +1,28 @@ +.sample-host { + position: relative; + /* Fill the router area so panes (and percentage-height grids inside them) have a + definite height to resolve against. */ + height: 100%; + /* Clip the off-screen inactive panes so they can't add phantom scrollbars. */ + overflow: hidden; +} + +/* Panes fill the host's height. Samples that size their grid with calc(100vh - N) (HR, Fleet) + are unaffected; samples that use height:100% (Finance, Sales) need this height chain to + reach #finance-section / #sales-section, otherwise the grid collapses to content height. */ +.sample-pane { + height: 100%; +} + +/* Inactive panes are moved fully off-screen rather than hidden with visibility:hidden -- + some Ignite UI parts (e.g. pivot value chips) force visibility:visible on themselves and + would bleed through over the active sample. Off-screen positioning can't be overridden by a + descendant, and it keeps the panes laid out at the same size, so prewarmed grids stay + measured and activating a pane needs no reflow (the switch is instant). */ +.sample-pane--hidden { + position: absolute; + top: 0; + left: -100000px; + width: 100%; + pointer-events: none; +} diff --git a/BlazorGridExamples/Program.cs b/BlazorGridExamples/Program.cs index 2f7a57c..be14295 100644 --- a/BlazorGridExamples/Program.cs +++ b/BlazorGridExamples/Program.cs @@ -16,13 +16,36 @@ // Register IgniteUI Blazor -builder.Services.AddIgniteUIBlazor(typeof(IgbIconModule)); +builder.Services.AddIgniteUIBlazor( + typeof(IgbIconModule), + typeof(IgbGridModule), + typeof(IgbAvatarModule), + typeof(IgbBadgeModule), + typeof(IgbButtonModule), + typeof(IgbTabsModule), + typeof(IgbCarouselModule), + typeof(IgbCategoryChartModule), + typeof(IgbPieChartModule), + typeof(IgbSelectModule), + typeof(IgbLinearProgressModule), + typeof(IgbInputModule), + typeof(IgbHierarchicalGridModule), + typeof(IgbRatingModule), + typeof(IgbDataChartCoreModule), + typeof(IgbDataChartCategoryModule), + typeof(IgbDataChartInteractivityModule), + typeof(IgbTreeGridModule), + typeof(IgbPaginatorModule), + typeof(IgbIconButtonModule), + typeof(IgbDropdownModule), + typeof(IgbPivotGridModule), + typeof(IgbPivotDataSelectorModule)); // Register Data Services for samples builder.Services.AddScoped(); builder.Services.AddScoped(); builder.Services.AddScoped(); builder.Services.AddScoped(); -builder.Services.AddScoped(); +builder.Services.AddScoped(); await builder.Build().RunAsync(); diff --git a/BlazorGridExamples/wwwroot/css/app.css b/BlazorGridExamples/wwwroot/css/app.css index 1584763..fc1c74c 100644 --- a/BlazorGridExamples/wwwroot/css/app.css +++ b/BlazorGridExamples/wwwroot/css/app.css @@ -10,7 +10,7 @@ .demo-container { width: 100%; - height: 100%; + height: 100vh; display: flex; flex-direction: column; align-items: center; @@ -70,7 +70,7 @@ padding: 12px; cursor: pointer; user-select: none; - color: black; + color: var(--ig-gray-800); box-sizing: border-box; } @@ -105,7 +105,7 @@ width: 100%; height: 90px; padding: 20px 24px; - border: 1px solid #D6D6D6; + border: 1px solid var(--ig-gray-300); } .current-tab-info .sample-info { @@ -138,7 +138,7 @@ letter-spacing: 0.15px; height: 40px; padding-right: 16px; - border-right: 1px solid #D6D6D6; + border-right: 1px solid var(--ig-gray-300); } .current-tab-info .sample-actions .action-buttons { @@ -147,14 +147,31 @@ gap: 16px; } + .current-tab-info .sample-actions .action-buttons .action-btn { + display: inline-flex; + cursor: pointer; + } + + .current-tab-info .sample-actions .action-buttons .btn-icon { + --ig-icon-size: 18px; + width: 18px; + height: 18px; + margin-right: 4px; + color: var(--ig-gray-800); + } + + .current-tab-info .sample-actions .action-buttons .btn-icon::part(icon) { + color: var(--ig-gray-800); + } + .current-tab-info .sample-actions .action-buttons .custom-button::part(base) { - color: black; - border-color: #D6D6D6; + color: var(--ig-gray-800); + border-color: var(--ig-gray-300); text-transform: unset; } .current-tab-info .sample-actions .action-buttons .custom-button::part(base) igc-icon::part(icon) { - color: black; + color: var(--ig-gray-800); } :fullscreen, @@ -166,7 +183,7 @@ height: 100vh; display: flex; flex-direction: column; - background: white; + background: var(--ig-surface-500); } :host(:fullscreen) .demo-container, @@ -197,4 +214,9 @@ body { margin: 0; padding: 0; min-width: 1100px; + /* The dashboard fills exactly the viewport; the grids scroll internally, so the page + itself must never produce its own vertical/horizontal scrollbar. */ + overflow: hidden; + background-color: var(--ig-surface-500); + color: var(--ig-gray-900); } diff --git a/BlazorGridExamples/wwwroot/index.html b/BlazorGridExamples/wwwroot/index.html index 2385e5d..13376ab 100644 --- a/BlazorGridExamples/wwwroot/index.html +++ b/BlazorGridExamples/wwwroot/index.html @@ -7,12 +7,19 @@ BlazorGridExamples + + + + + + + diff --git a/BlazorGridExamples/wwwroot/scripts/scope-css.js b/BlazorGridExamples/wwwroot/scripts/scope-css.js index 763fc1f..092ba2e 100644 --- a/BlazorGridExamples/wwwroot/scripts/scope-css.js +++ b/BlazorGridExamples/wwwroot/scripts/scope-css.js @@ -1,32 +1,85 @@ -window.scopeThemeToElement = async function(cssUrl, scopeSelector) { - // Prevent loading same theme twice - const styleId = `scoped-theme-${scopeSelector.replace(/[^a-zA-Z0-9]/g, '')}`; +// Fetches a stock Ignite UI theme at runtime and re-applies it under a scope selector, so a +// section of the app can use a different theme than the global one. Two modes: +// +// tokens-only (default): inject just the theme's :root design tokens. Lightweight; the +// globally-loaded component rules read var(--ig-*), so the palette/typography re-themes. +// Good enough for sections whose look is palette-driven. +// +// full (3rd arg === true): re-scope the theme's ENTIRE ruleset (component rules + tokens) +// under the selector, so component-level styling (button states, checkbox shape, etc.) +// matches the target theme exactly. Heavier (injects the whole theme), so it's opt-in. +// +// The full mode parses with the browser's own engine (a temporary + + + + + + + + + + + + + } +
+
@code { + [Parameter] public bool IsActive { get; set; } + private bool isLoading = true; - private System.Timers.Timer? updateTimer; + private PeriodicTimer? updateTimer; private IgbGrid? grid; + private string searchTerm = ""; + private IgbColumnPipeArgs currencyDigitsFormat = new IgbColumnPipeArgs { DigitsInfo = "1.2-2" }; + + private List FilteredData => + string.IsNullOrWhiteSpace(searchTerm) + ? FinancialService.Data + : FinancialService.Data.Where(d => + (d.Id != null && d.Id.Contains(searchTerm, StringComparison.OrdinalIgnoreCase)) || + (d.HoldingName != null && d.HoldingName.Contains(searchTerm, StringComparison.OrdinalIgnoreCase))) + .ToList(); + protected override async Task OnInitializedAsync() { FinancialService.OnDataChanged += OnDataChanged; - await FinancialService.LoadDataAsync(); + // Data persists in the singleton service, so only fetch the first time. + if (FinancialService.Data.Count == 0) + { + await FinancialService.LoadDataAsync(); + } isLoading = false; + } + + protected override void OnParametersSet() + { + // Only run the live-update loop while this sample is the visible tab; pause it when + // hidden so background tabs don't burn CPU or re-render off-screen grids. + if (IsActive) + { + EnsureTimerRunning(); + } + else + { + StopTimer(); + } + } - // Start auto-update timer (every 3 seconds) - updateTimer = new System.Timers.Timer(3000); - updateTimer.Elapsed += (sender, args) => + private void EnsureTimerRunning() + { + if (updateTimer is not null) return; + _ = RunLiveUpdatesAsync(); + } + + protected override async Task OnAfterRenderAsync(bool firstRender) + { + if (firstRender) + { + // Re-theme this sample to Bootstrap at the component level (full=true) by re-scoping + // the whole stock theme under #finance-section, so buttons/checkboxes/headers match + // Bootstrap exactly. The scopeThemeToElement helper dedupes, so remounts won't re-inject. + await JS.InvokeVoidAsync("scopeThemeToElement", + "_content/IgniteUI.Blazor/themes/light/bootstrap.css", "#finance-section", true); + await JS.InvokeVoidAsync("scopeThemeToElement", + "_content/IgniteUI.Blazor/themes/grid/light/bootstrap.css", "#finance-section", true); + } + } + + private async Task RunLiveUpdatesAsync() + { + updateTimer = new PeriodicTimer(TimeSpan.FromSeconds(3)); + while (await updateTimer.WaitForNextTickAsync()) { FinancialService.UpdateAllPrices(); - }; - updateTimer.Start(); + } + } + + private void StopTimer() + { + updateTimer?.Dispose(); + updateTimer = null; } private void OnDataChanged() @@ -81,18 +148,13 @@ InvokeAsync(() => { StateHasChanged(); - // Trigger grid change detection to refresh with updated data - if (grid != null) - { - grid.MarkForCheck(); - } + grid?.MarkForCheck(); }); } public void Dispose() { - updateTimer?.Stop(); - updateTimer?.Dispose(); + StopTimer(); FinancialService.OnDataChanged -= OnDataChanged; } } diff --git a/samples/FinanceGrid/FinanceGridComponent.razor.css b/samples/FinanceGrid/FinanceGridComponent.razor.css deleted file mode 100644 index c6afca4..0000000 --- a/samples/FinanceGrid/FinanceGridComponent.razor.css +++ /dev/null @@ -1,6 +0,0 @@ -.my-component { - border: 2px dashed red; - padding: 1em; - margin: 1em 0; - background-image: url('background.png'); -} diff --git a/samples/FinanceGrid/Models/FinancialData.cs b/samples/FinanceGrid/Models/FinancialData.cs index 42289e4..0d07a1a 100644 --- a/samples/FinanceGrid/Models/FinancialData.cs +++ b/samples/FinanceGrid/Models/FinancialData.cs @@ -33,6 +33,9 @@ public class FinancialData [JsonPropertyName("dailyPercentageChange")] public double DailyPercentageChange { get; set; } + + [JsonPropertyName("holdingPeriod")] + public int HoldingPeriod { get; set; } } public class PriceValue diff --git a/samples/FinanceGrid/Services/FinancialService.cs b/samples/FinanceGrid/Services/FinancialService.cs index 457f5e5..f31cad1 100644 --- a/samples/FinanceGrid/Services/FinancialService.cs +++ b/samples/FinanceGrid/Services/FinancialService.cs @@ -75,6 +75,8 @@ public void UpdateAllPrices() dataRow.DailyPercentageChange = randomizedData.DailyPercentageChange; } + // New list reference so the Blazor grid re-syncs the mutated rows to the web component. + Data = new List(Data); OnDataChanged?.Invoke(); } @@ -93,8 +95,7 @@ private double CalculateProfitLossPercentage(double profitLossValue, double boug private double CalculateDailyPercentageChange(double initialPrice, double finalPrice) { - var priceDifference = finalPrice - initialPrice; - return (priceDifference / initialPrice) * 100; + return (finalPrice - initialPrice) / initialPrice; } private (double NewPrice, double ProfitLossValue, double ProfitLossPercentage, double MarketValue, double DailyPercentageChange) diff --git a/samples/FinanceGrid/wwwroot/background.png b/samples/FinanceGrid/wwwroot/background.png deleted file mode 100644 index e15a3bd..0000000 Binary files a/samples/FinanceGrid/wwwroot/background.png and /dev/null differ diff --git a/samples/FinanceGrid/wwwroot/companies/3M.png b/samples/FinanceGrid/wwwroot/companies/3M.png new file mode 100644 index 0000000..459eb05 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/3M.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Adobe.png b/samples/FinanceGrid/wwwroot/companies/Adobe.png new file mode 100644 index 0000000..faeb8c6 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Adobe.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Advanced.png b/samples/FinanceGrid/wwwroot/companies/Advanced.png new file mode 100644 index 0000000..aaeaaa9 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Advanced.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Airbnb.png b/samples/FinanceGrid/wwwroot/companies/Airbnb.png new file mode 100644 index 0000000..3948673 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Airbnb.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Alibaba.png b/samples/FinanceGrid/wwwroot/companies/Alibaba.png new file mode 100644 index 0000000..3ca2aa9 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Alibaba.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Alphabet.png b/samples/FinanceGrid/wwwroot/companies/Alphabet.png new file mode 100644 index 0000000..d76a483 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Alphabet.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Amazon.com.png b/samples/FinanceGrid/wwwroot/companies/Amazon.com.png new file mode 100644 index 0000000..d56cf46 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Amazon.com.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/American.png b/samples/FinanceGrid/wwwroot/companies/American.png new file mode 100644 index 0000000..6fd8aeb Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/American.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Apple.png b/samples/FinanceGrid/wwwroot/companies/Apple.png new file mode 100644 index 0000000..4962775 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Apple.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Bitcoin.png b/samples/FinanceGrid/wwwroot/companies/Bitcoin.png new file mode 100644 index 0000000..dc6d97d Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Bitcoin.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Boeing.png b/samples/FinanceGrid/wwwroot/companies/Boeing.png new file mode 100644 index 0000000..fb3eb84 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Boeing.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Booking.png b/samples/FinanceGrid/wwwroot/companies/Booking.png new file mode 100644 index 0000000..9953e70 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Booking.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Caterpillar.png b/samples/FinanceGrid/wwwroot/companies/Caterpillar.png new file mode 100644 index 0000000..45e35ce Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Caterpillar.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Chevron.png b/samples/FinanceGrid/wwwroot/companies/Chevron.png new file mode 100644 index 0000000..4c97dbd Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Chevron.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Cisco.png b/samples/FinanceGrid/wwwroot/companies/Cisco.png new file mode 100644 index 0000000..2e2c553 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Cisco.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Coca-Cola.png b/samples/FinanceGrid/wwwroot/companies/Coca-Cola.png new file mode 100644 index 0000000..e8e11e6 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Coca-Cola.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Costco.png b/samples/FinanceGrid/wwwroot/companies/Costco.png new file mode 100644 index 0000000..dbba209 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Costco.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Dominos.png b/samples/FinanceGrid/wwwroot/companies/Dominos.png new file mode 100644 index 0000000..b23e21e Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Dominos.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Ethereum.png b/samples/FinanceGrid/wwwroot/companies/Ethereum.png new file mode 100644 index 0000000..96ba8c4 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Ethereum.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Exxon.png b/samples/FinanceGrid/wwwroot/companies/Exxon.png new file mode 100644 index 0000000..5649014 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Exxon.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/FedEx.png b/samples/FinanceGrid/wwwroot/companies/FedEx.png new file mode 100644 index 0000000..61b23ac Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/FedEx.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Ford.png b/samples/FinanceGrid/wwwroot/companies/Ford.png new file mode 100644 index 0000000..78f1a00d Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Ford.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/General.png b/samples/FinanceGrid/wwwroot/companies/General.png new file mode 100644 index 0000000..53442e5 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/General.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Honeywell.png b/samples/FinanceGrid/wwwroot/companies/Honeywell.png new file mode 100644 index 0000000..f51ba37 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Honeywell.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/IBM.png b/samples/FinanceGrid/wwwroot/companies/IBM.png new file mode 100644 index 0000000..9695845 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/IBM.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Intel.png b/samples/FinanceGrid/wwwroot/companies/Intel.png new file mode 100644 index 0000000..f56839b Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Intel.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/JPMorgan.png b/samples/FinanceGrid/wwwroot/companies/JPMorgan.png new file mode 100644 index 0000000..d086d15 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/JPMorgan.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Johnson.png b/samples/FinanceGrid/wwwroot/companies/Johnson.png new file mode 100644 index 0000000..8c7bee8 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Johnson.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Kellogg.png b/samples/FinanceGrid/wwwroot/companies/Kellogg.png new file mode 100644 index 0000000..bc8d451 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Kellogg.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/McDonalds.png b/samples/FinanceGrid/wwwroot/companies/McDonalds.png new file mode 100644 index 0000000..77f9109 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/McDonalds.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Microsoft.png b/samples/FinanceGrid/wwwroot/companies/Microsoft.png new file mode 100644 index 0000000..fb4711b Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Microsoft.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Mondelez.png b/samples/FinanceGrid/wwwroot/companies/Mondelez.png new file mode 100644 index 0000000..3d0e611 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Mondelez.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Morgan.png b/samples/FinanceGrid/wwwroot/companies/Morgan.png new file mode 100644 index 0000000..044c16c Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Morgan.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/NVIDIA.png b/samples/FinanceGrid/wwwroot/companies/NVIDIA.png new file mode 100644 index 0000000..39ee3a0 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/NVIDIA.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Netflix.png b/samples/FinanceGrid/wwwroot/companies/Netflix.png new file mode 100644 index 0000000..f1c93fb Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Netflix.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/PayPal.png b/samples/FinanceGrid/wwwroot/companies/PayPal.png new file mode 100644 index 0000000..069ca17 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/PayPal.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/PepsiCo.png b/samples/FinanceGrid/wwwroot/companies/PepsiCo.png new file mode 100644 index 0000000..8be0a30 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/PepsiCo.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Pfizer.png b/samples/FinanceGrid/wwwroot/companies/Pfizer.png new file mode 100644 index 0000000..ffecb04 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Pfizer.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Procter.png b/samples/FinanceGrid/wwwroot/companies/Procter.png new file mode 100644 index 0000000..aed1027 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Procter.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Salesforce.png b/samples/FinanceGrid/wwwroot/companies/Salesforce.png new file mode 100644 index 0000000..316712c Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Salesforce.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Spotify.png b/samples/FinanceGrid/wwwroot/companies/Spotify.png new file mode 100644 index 0000000..8f15517 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Spotify.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Starbucks.png b/samples/FinanceGrid/wwwroot/companies/Starbucks.png new file mode 100644 index 0000000..d3b3d8f Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Starbucks.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Tesla.png b/samples/FinanceGrid/wwwroot/companies/Tesla.png new file mode 100644 index 0000000..56856ff Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Tesla.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/The.png b/samples/FinanceGrid/wwwroot/companies/The.png new file mode 100644 index 0000000..2ab44f2 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/The.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Uber.png b/samples/FinanceGrid/wwwroot/companies/Uber.png new file mode 100644 index 0000000..82f26bf Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Uber.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Visa.png b/samples/FinanceGrid/wwwroot/companies/Visa.png new file mode 100644 index 0000000..a3ebd79 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Visa.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Walmart.png b/samples/FinanceGrid/wwwroot/companies/Walmart.png new file mode 100644 index 0000000..c7d6038 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Walmart.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Walt.png b/samples/FinanceGrid/wwwroot/companies/Walt.png new file mode 100644 index 0000000..9846ac5 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Walt.png differ diff --git a/samples/FinanceGrid/wwwroot/companies/Zoom.png b/samples/FinanceGrid/wwwroot/companies/Zoom.png new file mode 100644 index 0000000..4aa2bc7 Binary files /dev/null and b/samples/FinanceGrid/wwwroot/companies/Zoom.png differ diff --git a/samples/FinanceGrid/wwwroot/exampleJsInterop.js b/samples/FinanceGrid/wwwroot/exampleJsInterop.js deleted file mode 100644 index ea8d76a..0000000 --- a/samples/FinanceGrid/wwwroot/exampleJsInterop.js +++ /dev/null @@ -1,6 +0,0 @@ -// This is a JavaScript module that is loaded on demand. It can export any number of -// functions, and may import other JavaScript modules if required. - -export function showPrompt(message) { - return prompt(message, 'Type anything here'); -} diff --git a/samples/FinanceGrid/wwwroot/scripts/finance-grid-templates.js b/samples/FinanceGrid/wwwroot/scripts/finance-grid-templates.js new file mode 100644 index 0000000..0417ad6 --- /dev/null +++ b/samples/FinanceGrid/wwwroot/scripts/finance-grid-templates.js @@ -0,0 +1,39 @@ +(function registerFinanceGridTemplates() { + if (!window.igRegisterScript || !window.igTemplating || !window.igTemplating.html) { + setTimeout(registerFinanceGridTemplates, 50); + return; + } + const html = window.igTemplating.html; + const icons = { + up: html``, + down: html`` + }; + const trend = (v) => (v >= 0 ? icons.up : icons.down); + const sign = (v) => (v >= 0 ? "profit" : "loss"); + + window.igRegisterScript("financeAssetCell", (ctx) => { + const name = ctx.cell.value || ""; + const logo = "_content/FinanceGrid/companies/" + name.split(" ")[0] + ".png"; + return html`
${name}
`; + }, false); + + window.igRegisterScript("financePercentCell", (ctx) => { + const v = ctx.cell.value || 0; + return html`
${(v * 100).toFixed(2)}%${trend(v)}
`; + }, false); + + window.igRegisterScript("financeProfitValueCell", (ctx) => { + const v = ctx.cell.value || 0; + const formatted = (v < 0 ? "-$" : "$") + Math.abs(v).toFixed(2); + return html`
${formatted}${trend(v)}
`; + }, false); + + window.igRegisterScript("financeAllocationCell", (ctx) => { + const pct = ((ctx.cell.value || 0) * 100).toFixed(2); + return html`
${pct}%
`; + }, false); + + window.igRegisterScript("financeHoldingPeriodCell", (ctx) => { + return html`${ctx.cell.value} days`; + }, false); +})(); diff --git a/samples/FinanceGrid/wwwroot/styles/finance.css b/samples/FinanceGrid/wwwroot/styles/finance.css new file mode 100644 index 0000000..df868ed --- /dev/null +++ b/samples/FinanceGrid/wwwroot/styles/finance.css @@ -0,0 +1,97 @@ +#finance-section { + height: 100%; + display: flex; + flex-direction: column; + --ig-size: var(--ig-size-small); +} + +#finance-section .finance-container { + flex: 1; + min-height: 0; + width: 100%; +} + +/* Title on the left, search on the right (matches the web-components layout). The toolbar + title, buttons and column-header typography are driven by the scoped Bootstrap theme + (full-scope), so no manual color/weight overrides are needed here. */ +#finance-section .igx-grid-toolbar__title { + flex: 0 0 auto; +} + +#finance-section .igx-grid-toolbar__custom-content { + flex: 1 1 auto; + justify-content: flex-start; +} + +#finance-section .finance-search { + width: 240px; + height: 32px; + margin-left: auto; + margin-right: 8px; + padding: 4px 10px; + /* Match the WC filter input: Bootstrap system font at 16px, gray text/placeholder. */ + font-family: var(--ig-font-family); + font-size: 1rem; + color: var(--ig-gray-700); + background-color: #fff; + border: 1px solid var(--ig-gray-400); + border-radius: 4px; + box-sizing: border-box; +} + +#finance-section .finance-search::placeholder { + color: var(--ig-gray-700); +} + +#finance-section .finance-search:focus { + outline: 0; + border-color: var(--ig-primary-300); + box-shadow: 0 0 0 0.2rem hsl(from var(--ig-primary-500) h s l / 0.25); +} + +#finance-section .cell-flex { + display: flex; + align-items: center; + gap: 0.4rem; +} + +#finance-section .asset-avatar { + --size: 24px; + --ig-size: var(--ig-size-small); +} + +#finance-section .cell-flex svg { + width: 16px; + height: 16px; + flex-shrink: 0; +} + +#finance-section .profit { + color: var(--ig-success-500); + font-weight: 600; +} + +#finance-section .loss { + color: var(--ig-error-500); + font-weight: 600; +} + +#finance-section .alloc-cell { + display: flex; + align-items: center; + gap: 0.5rem; + width: 100%; +} + +#finance-section .alloc-cell igc-linear-progress { + flex: 1; + min-width: 60px; + height: 12px; +} + +#finance-section .alloc-cell igc-linear-progress::part(base), +#finance-section .alloc-cell igc-linear-progress::part(track), +#finance-section .alloc-cell igc-linear-progress::part(fill) { + height: 12px; + border-radius: 4px; +} diff --git a/samples/FleetManagement/ExampleJsInterop.cs b/samples/FleetManagement/ExampleJsInterop.cs deleted file mode 100644 index b8db55c..0000000 --- a/samples/FleetManagement/ExampleJsInterop.cs +++ /dev/null @@ -1,32 +0,0 @@ -using Microsoft.JSInterop; - -namespace FleetManagement -{ - // This class provides an example of how JavaScript functionality can be wrapped - // in a .NET class for easy consumption. The associated JavaScript module is - // loaded on demand when first needed. - // - // This class can be registered as scoped DI service and then injected into Blazor - // components for use. - - public class ExampleJsInterop(IJSRuntime jsRuntime) : IAsyncDisposable - { - private readonly Lazy> moduleTask = new(() => jsRuntime.InvokeAsync( - "import", "./_content/FleetManagement/exampleJsInterop.js").AsTask()); - - public async ValueTask Prompt(string message) - { - var module = await moduleTask.Value; - return await module.InvokeAsync("showPrompt", message); - } - - public async ValueTask DisposeAsync() - { - if (moduleTask.IsValueCreated) - { - var module = await moduleTask.Value; - await module.DisposeAsync(); - } - } - } -} diff --git a/samples/FleetManagement/FleetManagement.csproj b/samples/FleetManagement/FleetManagement.csproj index fd2f805..8e22ef3 100644 --- a/samples/FleetManagement/FleetManagement.csproj +++ b/samples/FleetManagement/FleetManagement.csproj @@ -12,7 +12,7 @@ - + diff --git a/samples/FleetManagement/FleetManagementComponent.razor b/samples/FleetManagement/FleetManagementComponent.razor index e0f5600..bbc4f42 100644 --- a/samples/FleetManagement/FleetManagementComponent.razor +++ b/samples/FleetManagement/FleetManagementComponent.razor @@ -1,10 +1,14 @@ -@using FleetManagement.Services +@using FleetManagement.Services @using FleetManagement.Models @using IgniteUI.Blazor.Controls +@using Microsoft.JSInterop @inject FleetService FleetService -@implements IDisposable +@inject IJSRuntime JS -
+ + +
+
@if (isLoading) {
@@ -22,66 +26,114 @@ } else { - - - - - - - - - - - + + + Fleet Management + + @if (hasSort) + { + + @((MarkupString)ClearIcon) + Clear Sort + + } + + + + + + + + + + + + + + + + + + + @{ + var ctx = (IgbGridMasterDetailContext)detail; + var vehicle = (FleetData)ctx.Implicit; + } + + -
- - Data updates every 3 seconds to simulate live fleet tracking - -
}
+
@code { + private const string ClearIcon = """"""; + private bool isLoading = true; - private System.Timers.Timer? updateTimer; + private bool optionalDataLoaded; private IgbGrid? grid; - protected override async Task OnInitializedAsync() + private IgbSortingExpression[] sortExpressions = { - FleetService.OnDataChanged += OnDataChanged; - await FleetService.LoadDataAsync(); - isLoading = false; + new() { FieldName = "VehicleId", Dir = SortingDirection.Asc } + }; - // Start auto-update timer (every 3 seconds) - updateTimer = new System.Timers.Timer(3000); - updateTimer.Elapsed += (sender, args) => - { - FleetService.UpdateAllData(); - }; - updateTimer.Start(); + private bool hasSort = true; + + private void OnSortingDone(IgbSortingExpressionEventArgs args) + { + hasSort = args.Detail is { Length: > 0 }; } - private void OnDataChanged() + private async Task ClearSort() { - InvokeAsync(() => + // The SortingExpressions parameter only seeds the grid's initial sort; once the user + // sorts, the grid owns its sort state, so reassigning the bound field is a no-op. + // Clear it through the grid's own API instead. + if (grid is not null) { - StateHasChanged(); - if (grid != null) - { - grid.MarkForCheck(); - } - }); + await grid.ClearSortAsync(); + } + sortExpressions = Array.Empty(); + hasSort = false; + await InvokeAsync(StateHasChanged); + } + + protected override async Task OnInitializedAsync() + { + await FleetService.LoadDataAsync(); + isLoading = false; } - public void Dispose() + protected override async Task OnAfterRenderAsync(bool firstRender) { - updateTimer?.Stop(); - updateTimer?.Dispose(); - FleetService.OnDataChanged -= OnDataChanged; + if (firstRender) + { + // Re-theme this sample to dark Material by scoping the stock theme's design + // tokens to #fleet-section, instead of shipping a hand-generated token dump. + // The scopeThemeToElement helper dedupes, so remounts won't re-inject. + await JS.InvokeVoidAsync("scopeThemeToElement", + "_content/IgniteUI.Blazor/themes/dark/material.css", "#fleet-section"); + await JS.InvokeVoidAsync("scopeThemeToElement", + "_content/IgniteUI.Blazor/themes/grid/dark/material.css", "#fleet-section"); + } + + if (firstRender && !optionalDataLoaded) + { + optionalDataLoaded = true; + await FleetService.LoadOptionalDataAsync(); + await InvokeAsync(StateHasChanged); + } } } diff --git a/samples/FleetManagement/FleetManagementComponent.razor.css b/samples/FleetManagement/FleetManagementComponent.razor.css index c6afca4..526191f 100644 --- a/samples/FleetManagement/FleetManagementComponent.razor.css +++ b/samples/FleetManagement/FleetManagementComponent.razor.css @@ -1,6 +1,3 @@ -.my-component { - border: 2px dashed red; - padding: 1em; - margin: 1em 0; - background-image: url('background.png'); +.fleet-container { + height: 100%; } diff --git a/samples/FleetManagement/Models/FleetData.cs b/samples/FleetManagement/Models/FleetData.cs index c84e69a..f840f6d 100644 --- a/samples/FleetManagement/Models/FleetData.cs +++ b/samples/FleetManagement/Models/FleetData.cs @@ -4,39 +4,75 @@ namespace FleetManagement.Models; public class FleetData { - [JsonPropertyName("id")] - public string? Id { get; set; } - [JsonPropertyName("vehicleId")] public string? VehicleId { get; set; } - + + [JsonPropertyName("licensePlate")] + public string? LicensePlate { get; set; } + [JsonPropertyName("make")] public string? Make { get; set; } - + [JsonPropertyName("model")] public string? Model { get; set; } - - [JsonPropertyName("year")] - public int Year { get; set; } - - [JsonPropertyName("mileage")] - public double Mileage { get; set; } - - [JsonPropertyName("fuelLevel")] - public double FuelLevel { get; set; } - + + [JsonPropertyName("type")] + public string? Type { get; set; } + + [JsonPropertyName("vin")] + public string? Vin { get; set; } + [JsonPropertyName("status")] public string? Status { get; set; } - - [JsonPropertyName("driver")] - public string? Driver { get; set; } - - [JsonPropertyName("location")] - public string? Location { get; set; } - - [JsonPropertyName("lastService")] - public DateTime LastService { get; set; } - - [JsonPropertyName("nextService")] - public DateTime NextService { get; set; } + + [JsonPropertyName("locationCity")] + public string? LocationCity { get; set; } + + [JsonPropertyName("locationGps")] + public string? LocationGps { get; set; } + + [JsonPropertyName("details")] + public VehicleDetails? Details { get; set; } +} + +public class VehicleDetails +{ + [JsonPropertyName("generation")] + public string? Generation { get; set; } + + [JsonPropertyName("yearOfManufacture")] + public int YearOfManufacture { get; set; } + + [JsonPropertyName("fuelType")] + public string? FuelType { get; set; } + + [JsonPropertyName("doors")] + public int Doors { get; set; } + + [JsonPropertyName("seats")] + public int Seats { get; set; } + + [JsonPropertyName("transmission")] + public string? Transmission { get; set; } + + [JsonPropertyName("engine")] + public string? Engine { get; set; } + + [JsonPropertyName("power")] + public string? Power { get; set; } + + [JsonPropertyName("mileage")] + public string? Mileage { get; set; } + + [JsonPropertyName("cubature")] + public string? Cubature { get; set; } + + [JsonPropertyName("color")] + public string? Color { get; set; } + + [JsonPropertyName("msrp")] + public string? Msrp { get; set; } + + [JsonPropertyName("tollPassId")] + public string? TollPassId { get; set; } } diff --git a/samples/FleetManagement/Models/FleetDetailModels.cs b/samples/FleetManagement/Models/FleetDetailModels.cs new file mode 100644 index 0000000..ef33f0f --- /dev/null +++ b/samples/FleetManagement/Models/FleetDetailModels.cs @@ -0,0 +1,177 @@ +using System.Text.Json.Serialization; + +namespace FleetManagement.Models; + +public class Driver +{ + [JsonPropertyName("name")] + public string? Name { get; set; } + + [JsonPropertyName("license")] + public string? License { get; set; } + + [JsonPropertyName("address")] + public string? Address { get; set; } + + [JsonPropertyName("city")] + public string? City { get; set; } + + [JsonPropertyName("phone")] + public string? Phone { get; set; } + + [JsonPropertyName("email")] + public string? Email { get; set; } + + [JsonPropertyName("photo")] + public string? Photo { get; set; } +} + +public class TripRecord +{ + [JsonPropertyName("id")] + public int Id { get; set; } + + [JsonPropertyName("driverName")] + public string? DriverName { get; set; } + + [JsonPropertyName("start")] + public string? Start { get; set; } + + [JsonPropertyName("end")] + public string? End { get; set; } + + [JsonPropertyName("startLocation")] + public string? StartLocation { get; set; } + + [JsonPropertyName("endLocation")] + public string? EndLocation { get; set; } + + [JsonPropertyName("startMeter")] + public string? StartMeter { get; set; } + + [JsonPropertyName("endMeter")] + public string? EndMeter { get; set; } + + [JsonPropertyName("distance")] + public string? Distance { get; set; } + + [JsonPropertyName("totalTime")] + public string? TotalTime { get; set; } + + [JsonPropertyName("driverPhotoUrl")] + public string? DriverPhotoUrl { get; set; } +} + +public class VehicleTripHistory +{ + [JsonPropertyName("vehicleId")] + public string? VehicleId { get; set; } + + [JsonPropertyName("tripHistory")] + public List TripHistory { get; set; } = new(); +} + +public class MaintenanceRecord +{ + [JsonPropertyName("id")] + public int Id { get; set; } + + [JsonPropertyName("event")] + public string? Event { get; set; } + + [JsonPropertyName("date")] + public string? Date { get; set; } + + [JsonPropertyName("location")] + public string? Location { get; set; } + + [JsonPropertyName("type")] + public string? Type { get; set; } + + [JsonPropertyName("remarks")] + public string? Remarks { get; set; } +} + +public class VehicleMaintenance +{ + [JsonPropertyName("vehicleId")] + public string? VehicleId { get; set; } + + [JsonPropertyName("maintenance")] + public List Maintenance { get; set; } = new(); +} + +public class CarPhotoManifestEntry +{ + [JsonPropertyName("id")] + public string? Id { get; set; } + + [JsonPropertyName("folder")] + public string? Folder { get; set; } +} + +public class CostTypeSlice +{ + [JsonPropertyName("value")] + public double Value { get; set; } + + [JsonPropertyName("category")] + public string? Category { get; set; } + + [JsonPropertyName("summary")] + public string? Summary { get; set; } +} + +public class CostPerMeterPoint +{ + [JsonPropertyName("quarter")] + public string? Quarter { get; set; } + + [JsonPropertyName("costPerMeter")] + public double CostPerMeter { get; set; } +} + +public class FuelCostPoint +{ + [JsonPropertyName("month")] + public string? Month { get; set; } + + [JsonPropertyName("cost")] + public double Cost { get; set; } +} + +public class VehicleCost +{ + [JsonPropertyName("vehicleId")] + public string? VehicleId { get; set; } + + [JsonPropertyName("costPerType")] + public Dictionary> CostPerType { get; set; } = new(); + + [JsonPropertyName("costsPerMeterPerQuarter")] + public Dictionary> CostsPerMeterPerQuarter { get; set; } = new(); + + [JsonPropertyName("fuelCostsPerMonth")] + public List FuelCostsPerMonth { get; set; } = new(); +} + +public class UtilizationPoint +{ + [JsonPropertyName("month")] + public string? Month { get; set; } + + [JsonPropertyName("'2023'")] + public double Year2023 { get; set; } + + [JsonPropertyName("'2024'")] + public double Year2024 { get; set; } +} + +public class VehicleUtilization +{ + [JsonPropertyName("vehicleId")] + public string? VehicleId { get; set; } + + [JsonPropertyName("utilization")] + public List Utilization { get; set; } = new(); +} diff --git a/samples/FleetManagement/Services/FleetService.cs b/samples/FleetManagement/Services/FleetService.cs index 55bec96..c82e3e2 100644 --- a/samples/FleetManagement/Services/FleetService.cs +++ b/samples/FleetManagement/Services/FleetService.cs @@ -13,11 +13,23 @@ public class FleetService private const string UtilizationDataUrl = "https://www.infragistics.com/grid-examples-data/data/fleet/utilization.json"; private const string TripHistoryDataUrl = "https://www.infragistics.com/grid-examples-data/data/fleet/trip_history.json"; + private const string ContentRoot = "_content/FleetManagement"; + private const string CarPhotoManifestUrl = ContentRoot + "/data/car_photo_manifest.json"; + private const string CarImagesUrl = ContentRoot + "/data/car_images.json"; + private static readonly JsonSerializerOptions options = new() { PropertyNameCaseInsensitive = true }; + private List _drivers = new(); + private List _tripHistory = new(); + private List _maintenance = new(); + private List _cost = new(); + private List _utilization = new(); + private List _carPhotoManifest = new(); + private Dictionary> _carImages = new(); + public List Data { get; private set; } = new(); public event Action? OnDataChanged; @@ -37,23 +49,94 @@ public async Task LoadDataAsync() } catch (Exception) { - // Failed to load data - Data list remains empty } } - public void UpdateAllData() + public async Task LoadOptionalDataAsync() + { + _drivers = await GetAsync>(DriversDataUrl) ?? new(); + _tripHistory = await GetAsync>(TripHistoryDataUrl) ?? new(); + _maintenance = await GetAsync>(MaintanenceDataUrl) ?? new(); + _cost = await GetAsync>(CostDataUrl) ?? new(); + _utilization = await GetAsync>(UtilizationDataUrl) ?? new(); + _carPhotoManifest = await GetAsync>(CarPhotoManifestUrl) ?? new(); + _carImages = await GetAsync>>(CarImagesUrl) ?? new(); + + OnDataChanged?.Invoke(); + } + + private async Task GetAsync(string url) + { + try + { + var json = await _httpClient.GetStringAsync(url); + return JsonSerializer.Deserialize(json, options); + } + catch (Exception) + { + return default; + } + } + + public List FindTripHistoryById(string? vehicleId) { - foreach (var dataRow in Data) + var trips = _tripHistory.FirstOrDefault(t => t.VehicleId == vehicleId)?.TripHistory ?? new(); + foreach (var trip in trips) { - // Simulate live data updates - randomly adjust mileage and fuel level - var mileageIncrease = Random.Shared.NextDouble() * 5; // 0-5 miles increase - dataRow.Mileage += Math.Round(mileageIncrease, 1); - - var fuelDecrease = Random.Shared.NextDouble() * 2; // 0-2% fuel decrease - dataRow.FuelLevel = Math.Max(0, dataRow.FuelLevel - fuelDecrease); - dataRow.FuelLevel = Math.Round(dataRow.FuelLevel, 1); + trip.DriverPhotoUrl ??= GetDriverPhotoPath(trip.DriverName); } + return trips; + } - OnDataChanged?.Invoke(); + public List FindMaintenanceById(string? vehicleId) => + _maintenance.FirstOrDefault(m => m.VehicleId == vehicleId)?.Maintenance ?? new(); + + public Driver? FindDriverByName(string? driverName) => + _drivers.FirstOrDefault(d => d.Name == driverName); + + public string GetDriverPhotoPath(string? driverName) + { + var photo = FindDriverByName(driverName)?.Photo; + return string.IsNullOrEmpty(photo) ? string.Empty : $"{ContentRoot}/people/{photo}.jpg"; + } + + private VehicleCost? FindCost(string? vehicleId) => + _cost.FirstOrDefault(c => c.VehicleId == vehicleId); + + public List FindCostsPerType(string? vehicleId, string period = "ytd") + { + var cost = FindCost(vehicleId); + return cost != null && cost.CostPerType.TryGetValue(period, out var slices) ? slices : new(); + } + + public List FindCostsPerMeter(string? vehicleId, string period = "ytd") + { + var cost = FindCost(vehicleId); + return cost != null && cost.CostsPerMeterPerQuarter.TryGetValue(period, out var points) ? points : new(); + } + + public List GetFuelCosts(string? vehicleId, string period = "ytd") + { + var months = FindCost(vehicleId)?.FuelCostsPerMonth ?? new(); + return period switch + { + "3months" => months.TakeLast(3).ToList(), + "6months" => months.TakeLast(6).ToList(), + _ => months + }; + } + + public List FindUtilization(string? vehicleId) => + _utilization.FirstOrDefault(u => u.VehicleId == vehicleId)?.Utilization ?? new(); + + public List GetCarImagePaths(string? vehicleId) + { + var folder = _carPhotoManifest.FirstOrDefault(c => c.Id == vehicleId)?.Folder; + if (string.IsNullOrEmpty(folder) || !_carImages.TryGetValue(folder, out var files)) + { + return new(); + } + + return files.Select(f => $"{ContentRoot}/cars/photos/{Uri.EscapeDataString(folder)}/{Uri.EscapeDataString(f)}").ToList(); } } diff --git a/samples/FleetManagement/VehicleDetailPanel.razor b/samples/FleetManagement/VehicleDetailPanel.razor new file mode 100644 index 0000000..83f332b --- /dev/null +++ b/samples/FleetManagement/VehicleDetailPanel.razor @@ -0,0 +1,265 @@ +@using FleetManagement.Services +@using FleetManagement.Models +@using IgniteUI.Blazor.Controls +@inject FleetService FleetService +@implements IDisposable + +@{ + var images = FleetService.GetCarImagePaths(Vehicle.VehicleId); + var trips = FleetService.FindTripHistoryById(Vehicle.VehicleId); + var maintenance = FleetService.FindMaintenanceById(Vehicle.VehicleId); + var costsPerType = FleetService.FindCostsPerType(Vehicle.VehicleId, GetChartPeriod("costType")); + var costsPerMeter = FleetService.FindCostsPerMeter(Vehicle.VehicleId, GetChartPeriod("costMeter")); + var fuelCosts = FleetService.GetFuelCosts(Vehicle.VehicleId, GetChartPeriod("fuel")); + var utilization = FleetService.FindUtilization(Vehicle.VehicleId); +} + + +
+
+ @if (images.Any()) + { + + @foreach (var (src, index) in images.Select((s, i) => (s, i))) + { + +
+ @Vehicle.Make @Vehicle.Model +
+ + } + + } +
+
+ @foreach (var categorySet in new[] { GetVehicleRows(Vehicle), GetEngineRows(Vehicle) }) + { +
+
+ @foreach (var row in categorySet) + { +
+ @row.Key: +
+ } +
+
+ @foreach (var row in categorySet) + { +
+ @row.Value +
+ } +
+
+ } +
+
+ + + + @if (IsTabActive("Trip History")) + { + + + + + + + + + + + + + } + + + + @if (IsTabActive("Maintenance")) + { + + + + + + + + + } + + + + @if (IsTabActive("Cost")) + { +
+
+
+ Costs per Type + + YTD + Last 3 Months + Last 6 Months + Last 12 Months + +
+
+ +
+
+
+
+ Cost per Meter, per Quarter + + YTD + 2023 + 2022 + 2021 + 2020 + +
+
+ +
+
+
+
+ Fuel Costs per Month + + YTD + Last 3 Months + Last 6 Months + Last 12 Months + +
+
+ +
+
+
+ } + + + + @if (IsTabActive("Utilization")) + { +
+
+

Utilization per Month

+
+ 2023 + 2024 +
+
+ +
+
+
+ } + + + +@code { + [Parameter, EditorRequired] public FleetData Vehicle { get; set; } = default!; + + private readonly HashSet _renderedTabs = new(); + + private bool IsTabActive(string label) + => label == "Details" || _renderedTabs.Contains(label); + + private void OnTabChange(IgbTabComponentEventArgs args) + { + var label = args.Detail?.Label; + if (label is not null) _renderedTabs.Add(label); + } + + protected override void OnInitialized() => FleetService.OnDataChanged += OnFleetDataChanged; + + public void Dispose() => FleetService.OnDataChanged -= OnFleetDataChanged; + + private void OnFleetDataChanged() => InvokeAsync(StateHasChanged); + + private readonly Dictionary _chartPeriod = new(); + + private string GetChartPeriod(string chart) + => _chartPeriod.TryGetValue(chart, out var p) ? p : "ytd"; + + private void SetChartPeriod(string chart, string value) + { + _chartPeriod[chart] = value; + StateHasChanged(); + } + + private static List> GetVehicleRows(FleetData v) + { + var d = v.Details; + return new() + { + new("Make", v.Make), + new("Generation", d?.Generation), + new("Year of Manufacture", d?.YearOfManufacture.ToString()), + new("Fuel Type", d?.FuelType), + new("Doors", d?.Doors.ToString()), + new("Seats", d?.Seats.ToString()), + new("Transmission", d?.Transmission) + }; + } + + private static List> GetEngineRows(FleetData v) + { + var d = v.Details; + return new() + { + new("Engine", d?.Engine), + new("Power", d?.Power), + new("Mileage", d?.Mileage), + new("Cubature", d?.Cubature), + new("Color", d?.Color), + new("MSRP", d?.Msrp), + new("Toll Pass ID", d?.TollPassId) + }; + } +} diff --git a/samples/FleetManagement/wwwroot/cars/logos/Ford.png b/samples/FleetManagement/wwwroot/cars/logos/Ford.png new file mode 100644 index 0000000..950a37e Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/logos/Ford.png differ diff --git a/samples/FleetManagement/wwwroot/cars/logos/Honda.png b/samples/FleetManagement/wwwroot/cars/logos/Honda.png new file mode 100644 index 0000000..4424bd1 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/logos/Honda.png differ diff --git a/samples/FleetManagement/wwwroot/cars/logos/Hyundai.png b/samples/FleetManagement/wwwroot/cars/logos/Hyundai.png new file mode 100644 index 0000000..6f9d514 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/logos/Hyundai.png differ diff --git a/samples/FleetManagement/wwwroot/cars/logos/Kia.png b/samples/FleetManagement/wwwroot/cars/logos/Kia.png new file mode 100644 index 0000000..f9d727e Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/logos/Kia.png differ diff --git a/samples/FleetManagement/wwwroot/cars/logos/Mazda.png b/samples/FleetManagement/wwwroot/cars/logos/Mazda.png new file mode 100644 index 0000000..dbd03db Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/logos/Mazda.png differ diff --git a/samples/FleetManagement/wwwroot/cars/logos/Tesla.png b/samples/FleetManagement/wwwroot/cars/logos/Tesla.png new file mode 100644 index 0000000..a8f5371 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/logos/Tesla.png differ diff --git a/samples/FleetManagement/wwwroot/cars/logos/Toyota.png b/samples/FleetManagement/wwwroot/cars/logos/Toyota.png new file mode 100644 index 0000000..2f96004 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/logos/Toyota.png differ diff --git a/samples/FleetManagement/wwwroot/cars/logos/VW.png b/samples/FleetManagement/wwwroot/cars/logos/VW.png new file mode 100644 index 0000000..94b626d Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/logos/VW.png differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 blue/Ford-F150-caleb-white-XGJBSkoqX_I-unsplash.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 blue/Ford-F150-caleb-white-XGJBSkoqX_I-unsplash.jpg new file mode 100644 index 0000000..5859716 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 blue/Ford-F150-caleb-white-XGJBSkoqX_I-unsplash.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 blue/Ford-F150-caleb-white-XGJBSkoqX_I-unsplash1.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 blue/Ford-F150-caleb-white-XGJBSkoqX_I-unsplash1.jpg new file mode 100644 index 0000000..0dd531f Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 blue/Ford-F150-caleb-white-XGJBSkoqX_I-unsplash1.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 blue/Ford-F150-caleb-white-XGJBSkoqX_I-unsplash2.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 blue/Ford-F150-caleb-white-XGJBSkoqX_I-unsplash2.jpg new file mode 100644 index 0000000..c7553ed Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 blue/Ford-F150-caleb-white-XGJBSkoqX_I-unsplash2.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 red/Ford-f150-7572360_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 red/Ford-f150-7572360_1920.jpg new file mode 100644 index 0000000..ab7c2b6 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 red/Ford-f150-7572360_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 red/Ford-f150-7572360_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 red/Ford-f150-7572360_19201.jpg new file mode 100644 index 0000000..5cb886d Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 red/Ford-f150-7572360_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 red/Ford-f150-7572360_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 red/Ford-f150-7572360_19202.jpg new file mode 100644 index 0000000..8a5d4f7 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford F-150 red/Ford-f150-7572360_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Focus blue/ford-focus-5167838_1280.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus blue/ford-focus-5167838_1280.jpg new file mode 100644 index 0000000..f828bca Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus blue/ford-focus-5167838_1280.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Focus blue/ford-focus-5167838_12801.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus blue/ford-focus-5167838_12801.jpg new file mode 100644 index 0000000..16014d6 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus blue/ford-focus-5167838_12801.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Focus blue/ford-focus-5167838_12802.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus blue/ford-focus-5167838_12802.jpg new file mode 100644 index 0000000..2a4fd1a Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus blue/ford-focus-5167838_12802.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Focus dark gray/1-1-Ford-Focus-car-3300587_1280.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus dark gray/1-1-Ford-Focus-car-3300587_1280.jpg new file mode 100644 index 0000000..8114461 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus dark gray/1-1-Ford-Focus-car-3300587_1280.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Focus dark gray/1-2-Ford-Focus-car-3300588_1280.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus dark gray/1-2-Ford-Focus-car-3300588_1280.jpg new file mode 100644 index 0000000..d125287 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus dark gray/1-2-Ford-Focus-car-3300588_1280.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Focus dark gray/1-3-Ford-Focus-car-3300587_1280.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus dark gray/1-3-Ford-Focus-car-3300587_1280.jpg new file mode 100644 index 0000000..826f7a3 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Focus dark gray/1-3-Ford-Focus-car-3300587_1280.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang blue/Ford-Mustang-automobile-1450573_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang blue/Ford-Mustang-automobile-1450573_1920.jpg new file mode 100644 index 0000000..3b65c24 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang blue/Ford-Mustang-automobile-1450573_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang blue/Ford-Mustang-automobile-1450573_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang blue/Ford-Mustang-automobile-1450573_19201.jpg new file mode 100644 index 0000000..afa2bbd Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang blue/Ford-Mustang-automobile-1450573_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang blue/Ford-Mustang-automobile-1450573_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang blue/Ford-Mustang-automobile-1450573_19202.jpg new file mode 100644 index 0000000..3fb360b Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang blue/Ford-Mustang-automobile-1450573_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang red/Ford-Mustang-convertible-1630448_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang red/Ford-Mustang-convertible-1630448_1920.jpg new file mode 100644 index 0000000..29515e1 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang red/Ford-Mustang-convertible-1630448_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang red/Ford-Mustang-convertible-1630448_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang red/Ford-Mustang-convertible-1630448_19201.jpg new file mode 100644 index 0000000..2d15371 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang red/Ford-Mustang-convertible-1630448_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang red/Ford-Mustang-convertible-1630448_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang red/Ford-Mustang-convertible-1630448_19202.jpg new file mode 100644 index 0000000..5cd6171 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Ford Mustang red/Ford-Mustang-convertible-1630448_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Honda Civic/honda-civic-4967605_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Honda Civic/honda-civic-4967605_1920.jpg new file mode 100644 index 0000000..7bacbfc Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Honda Civic/honda-civic-4967605_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Honda Civic/honda-civic-4967605_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Honda Civic/honda-civic-4967605_19201.jpg new file mode 100644 index 0000000..58b4858 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Honda Civic/honda-civic-4967605_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Honda Civic/honda-civic-4967605_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Honda Civic/honda-civic-4967605_19202.jpg new file mode 100644 index 0000000..1416ad6 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Honda Civic/honda-civic-4967605_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Hyundai Kona/Hyundai-Kona-electric-4964667_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Hyundai Kona/Hyundai-Kona-electric-4964667_1920.jpg new file mode 100644 index 0000000..31723c0 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Hyundai Kona/Hyundai-Kona-electric-4964667_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Hyundai Kona/Hyundai-Kona-electric-4964667_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Hyundai Kona/Hyundai-Kona-electric-4964667_19201.jpg new file mode 100644 index 0000000..ac676df Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Hyundai Kona/Hyundai-Kona-electric-4964667_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Hyundai Kona/Hyundai-Kona-electric-4964667_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Hyundai Kona/Hyundai-Kona-electric-4964667_19202.jpg new file mode 100644 index 0000000..b702436 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Hyundai Kona/Hyundai-Kona-electric-4964667_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Hyundai ix35/Hyundai-ix35-5505817_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Hyundai ix35/Hyundai-ix35-5505817_1920.jpg new file mode 100644 index 0000000..51de0d7 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Hyundai ix35/Hyundai-ix35-5505817_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Hyundai ix35/Hyundai-ix35-5505817_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Hyundai ix35/Hyundai-ix35-5505817_19201.jpg new file mode 100644 index 0000000..be27fd1 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Hyundai ix35/Hyundai-ix35-5505817_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Hyundai ix35/Hyundai-ix35-5505817_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Hyundai ix35/Hyundai-ix35-5505817_19202.jpg new file mode 100644 index 0000000..75b16de Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Hyundai ix35/Hyundai-ix35-5505817_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed red/Kia-Ceed-car-3305685_1280.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed red/Kia-Ceed-car-3305685_1280.jpg new file mode 100644 index 0000000..c9f2caa Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed red/Kia-Ceed-car-3305685_1280.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed red/Kia-Ceed-car-3305699_1280.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed red/Kia-Ceed-car-3305699_1280.jpg new file mode 100644 index 0000000..83308e5 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed red/Kia-Ceed-car-3305699_1280.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed red/Kia-ceed-car-3305686_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed red/Kia-ceed-car-3305686_1920.jpg new file mode 100644 index 0000000..c90c1f1 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed red/Kia-ceed-car-3305686_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed white/Kia-Ceed-car-6097887_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed white/Kia-Ceed-car-6097887_1920.jpg new file mode 100644 index 0000000..9079712 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed white/Kia-Ceed-car-6097887_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed white/Kia-Ceed-car-6097887_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed white/Kia-Ceed-car-6097887_19201.jpg new file mode 100644 index 0000000..8b8b3ce Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed white/Kia-Ceed-car-6097887_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed white/Kia-Ceed-car-6097887_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed white/Kia-Ceed-car-6097887_19202.jpg new file mode 100644 index 0000000..39c7d08 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Ceed white/Kia-Ceed-car-6097887_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 GT/KIA-EV6-GT-line (edited) hyundai-motor-group-ErBFxMkJpKk-unsplash-detail1.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 GT/KIA-EV6-GT-line (edited) hyundai-motor-group-ErBFxMkJpKk-unsplash-detail1.jpg new file mode 100644 index 0000000..8f29720 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 GT/KIA-EV6-GT-line (edited) hyundai-motor-group-ErBFxMkJpKk-unsplash-detail1.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 GT/KIA-EV6-GT-line (edited) hyundai-motor-group-ErBFxMkJpKk-unsplash.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 GT/KIA-EV6-GT-line (edited) hyundai-motor-group-ErBFxMkJpKk-unsplash.jpg new file mode 100644 index 0000000..8d197a8 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 GT/KIA-EV6-GT-line (edited) hyundai-motor-group-ErBFxMkJpKk-unsplash.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 GT/KIA-EV6-GT-line (edited) hyundai-motor-group-ErBFxMkJpKk-unsplash2.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 GT/KIA-EV6-GT-line (edited) hyundai-motor-group-ErBFxMkJpKk-unsplash2.jpg new file mode 100644 index 0000000..a693d4c Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 GT/KIA-EV6-GT-line (edited) hyundai-motor-group-ErBFxMkJpKk-unsplash2.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 gray/KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 gray/KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash.jpg new file mode 100644 index 0000000..babce47 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 gray/KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 gray/KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash1.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 gray/KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash1.jpg new file mode 100644 index 0000000..35e65b3 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 gray/KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash1.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 gray/KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash2.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 gray/KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash2.jpg new file mode 100644 index 0000000..d85ec4e Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 gray/KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash2.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 red/KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 red/KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash.jpg new file mode 100644 index 0000000..6acdff1 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 red/KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 red/KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash1.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 red/KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash1.jpg new file mode 100644 index 0000000..1d222f5 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 red/KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash1.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 red/KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash2.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 red/KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash2.jpg new file mode 100644 index 0000000..3987daf Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia EV6 red/KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash2.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Soul/Kia-Soul-car-2441815_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Soul/Kia-Soul-car-2441815_1920.jpg new file mode 100644 index 0000000..4e2b8b2 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Soul/Kia-Soul-car-2441815_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Soul/Kia-Soul-car-2441815_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Soul/Kia-Soul-car-2441815_19201.jpg new file mode 100644 index 0000000..46e5b2f Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Soul/Kia-Soul-car-2441815_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Soul/Kia-Soul-car-2441815_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Soul/Kia-Soul-car-2441815_19202.jpg new file mode 100644 index 0000000..2d192fe Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Soul/Kia-Soul-car-2441815_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Sportage/Kia-Sportage-2382086_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Sportage/Kia-Sportage-2382086_1920.jpg new file mode 100644 index 0000000..305a7ce Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Sportage/Kia-Sportage-2382086_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Sportage/Kia-Sportage-2382086_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Sportage/Kia-Sportage-2382086_19201.jpg new file mode 100644 index 0000000..a4f1d10 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Sportage/Kia-Sportage-2382086_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Kia Sportage/Kia-Sportage-2382086_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Kia Sportage/Kia-Sportage-2382086_19202.jpg new file mode 100644 index 0000000..a8c591c Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Kia Sportage/Kia-Sportage-2382086_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Mazda 3/mazda-3-7498005_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Mazda 3/mazda-3-7498005_1920.jpg new file mode 100644 index 0000000..4913970 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Mazda 3/mazda-3-7498005_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Mazda 3/mazda-3-7498005_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Mazda 3/mazda-3-7498005_19201.jpg new file mode 100644 index 0000000..9670a1d Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Mazda 3/mazda-3-7498005_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Mazda 3/mazda-3-7498005_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Mazda 3/mazda-3-7498005_19202.jpg new file mode 100644 index 0000000..5c41cbf Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Mazda 3/mazda-3-7498005_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Mazda 6/3-1-Mazda-6-car-6122178_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Mazda 6/3-1-Mazda-6-car-6122178_1920.jpg new file mode 100644 index 0000000..7ae228b Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Mazda 6/3-1-Mazda-6-car-6122178_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Mazda 6/3-2-Mazda-6-car-6122177_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Mazda 6/3-2-Mazda-6-car-6122177_1920.jpg new file mode 100644 index 0000000..07447d2 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Mazda 6/3-2-Mazda-6-car-6122177_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Mazda 6/3-3-Mazda-6-car-6122177_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Mazda 6/3-3-Mazda-6-car-6122177_1920.jpg new file mode 100644 index 0000000..5ff6df9 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Mazda 6/3-3-Mazda-6-car-6122177_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Mazda MX-5/2-1-Mazda-MX-5-cabriolet-3627312_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Mazda MX-5/2-1-Mazda-MX-5-cabriolet-3627312_1920.jpg new file mode 100644 index 0000000..a180747 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Mazda MX-5/2-1-Mazda-MX-5-cabriolet-3627312_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Mazda MX-5/2-2-Mazda-MX-5-cabriolet-3708152_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Mazda MX-5/2-2-Mazda-MX-5-cabriolet-3708152_1920.jpg new file mode 100644 index 0000000..b24e8e0 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Mazda MX-5/2-2-Mazda-MX-5-cabriolet-3708152_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Mazda MX-5/2-3-Mazda-MX-5-cabriolet-3708152_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Mazda MX-5/2-3-Mazda-MX-5-cabriolet-3708152_1920.jpg new file mode 100644 index 0000000..c5ba049 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Mazda MX-5/2-3-Mazda-MX-5-cabriolet-3708152_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 red/Tesla-3-car-8607713_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 red/Tesla-3-car-8607713_1920.jpg new file mode 100644 index 0000000..0b06ec7 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 red/Tesla-3-car-8607713_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 red/Tesla-3-car-8607713_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 red/Tesla-3-car-8607713_19201.jpg new file mode 100644 index 0000000..8af4bbe Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 red/Tesla-3-car-8607713_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 red/Tesla-3-car-8607713_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 red/Tesla-3-car-8607713_19202.jpg new file mode 100644 index 0000000..7b86fd0 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 red/Tesla-3-car-8607713_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 1/tesla-3-5937063_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 1/tesla-3-5937063_1920.jpg new file mode 100644 index 0000000..717c5c2 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 1/tesla-3-5937063_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 1/tesla-3-5937063_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 1/tesla-3-5937063_19201.jpg new file mode 100644 index 0000000..bf533b7 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 1/tesla-3-5937063_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 1/tesla-3-5937063_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 1/tesla-3-5937063_19202.jpg new file mode 100644 index 0000000..953f4ac Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 1/tesla-3-5937063_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 2/Tesla-3-charlie-deets-AkgALppFIwo-unsplash.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 2/Tesla-3-charlie-deets-AkgALppFIwo-unsplash.jpg new file mode 100644 index 0000000..8a1b126 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 2/Tesla-3-charlie-deets-AkgALppFIwo-unsplash.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 2/Tesla-3-charlie-deets-AkgALppFIwo-unsplash1.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 2/Tesla-3-charlie-deets-AkgALppFIwo-unsplash1.jpg new file mode 100644 index 0000000..8bdc8ea Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 2/Tesla-3-charlie-deets-AkgALppFIwo-unsplash1.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 2/Tesla-3-charlie-deets-AkgALppFIwo-unsplash2.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 2/Tesla-3-charlie-deets-AkgALppFIwo-unsplash2.jpg new file mode 100644 index 0000000..abc5273 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 2/Tesla-3-charlie-deets-AkgALppFIwo-unsplash2.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 3/Tesla-3-i-m-zion-A-JEMot0hWs-unsplash.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 3/Tesla-3-i-m-zion-A-JEMot0hWs-unsplash.jpg new file mode 100644 index 0000000..50044d4 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 3/Tesla-3-i-m-zion-A-JEMot0hWs-unsplash.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 3/Tesla-3-i-m-zion-A-JEMot0hWs-unsplash1.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 3/Tesla-3-i-m-zion-A-JEMot0hWs-unsplash1.jpg new file mode 100644 index 0000000..f42bc13 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 3/Tesla-3-i-m-zion-A-JEMot0hWs-unsplash1.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 3/Tesla-3-i-m-zion-A-JEMot0hWs-unsplash2.jpg b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 3/Tesla-3-i-m-zion-A-JEMot0hWs-unsplash2.jpg new file mode 100644 index 0000000..584e1fc Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Tesla 3 white 3/Tesla-3-i-m-zion-A-JEMot0hWs-unsplash2.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota Corolla/toyota-corolla-347288_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota Corolla/toyota-corolla-347288_1920.jpg new file mode 100644 index 0000000..b7bfd49 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota Corolla/toyota-corolla-347288_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota Corolla/toyota-corolla-347288_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota Corolla/toyota-corolla-347288_19201.jpg new file mode 100644 index 0000000..b81bc36 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota Corolla/toyota-corolla-347288_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota Corolla/toyota-corolla-347288_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota Corolla/toyota-corolla-347288_19202.jpg new file mode 100644 index 0000000..cbcaee9 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota Corolla/toyota-corolla-347288_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 1/Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 1/Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash.jpg new file mode 100644 index 0000000..bd69c56 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 1/Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 1/Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash1.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 1/Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash1.jpg new file mode 100644 index 0000000..3d5a407 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 1/Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash1.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 1/Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash2.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 1/Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash2.jpg new file mode 100644 index 0000000..c4fbbb7 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 1/Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash2.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 2/Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 2/Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash.jpg new file mode 100644 index 0000000..b796550 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 2/Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 2/Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash1.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 2/Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash1.jpg new file mode 100644 index 0000000..7da69ba Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 2/Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash1.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 2/Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash2.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 2/Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash2.jpg new file mode 100644 index 0000000..0e7af30 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 2/Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash2.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 3/Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 3/Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash.jpg new file mode 100644 index 0000000..47e9b9f Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 3/Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 3/Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash1.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 3/Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash1.jpg new file mode 100644 index 0000000..98be96a Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 3/Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash1.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 3/Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash2.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 3/Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash2.jpg new file mode 100644 index 0000000..441bbf8 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota RAV4 3/Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash2.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota Tundra/toyota-tundra-1241658_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota Tundra/toyota-tundra-1241658_1920.jpg new file mode 100644 index 0000000..0554e29 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota Tundra/toyota-tundra-1241658_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota Tundra/toyota-tundra-1241658_19201.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota Tundra/toyota-tundra-1241658_19201.jpg new file mode 100644 index 0000000..1b6b83d Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota Tundra/toyota-tundra-1241658_19201.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/Toyota Tundra/toyota-tundra-1241658_19202.jpg b/samples/FleetManagement/wwwroot/cars/photos/Toyota Tundra/toyota-tundra-1241658_19202.jpg new file mode 100644 index 0000000..0a0135d Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/Toyota Tundra/toyota-tundra-1241658_19202.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 1/VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 1/VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash.jpg new file mode 100644 index 0000000..d61db34 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 1/VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 1/VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash1.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 1/VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash1.jpg new file mode 100644 index 0000000..c373365 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 1/VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash1.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 1/VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash2.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 1/VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash2.jpg new file mode 100644 index 0000000..bc61026 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 1/VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash2.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 2/VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-2.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 2/VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-2.jpg new file mode 100644 index 0000000..1ecdfcb Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 2/VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-2.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 2/VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-21.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 2/VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-21.jpg new file mode 100644 index 0000000..cbf010e Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 2/VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-21.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 2/VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-22.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 2/VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-22.jpg new file mode 100644 index 0000000..03f253f Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Caddy 2/VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-22.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Golf/VW-Golf-car-5671331_1280.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Golf/VW-Golf-car-5671331_1280.jpg new file mode 100644 index 0000000..1ba7e55 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Golf/VW-Golf-car-5671331_1280.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Golf/vw-Golf-4332807_1280.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Golf/vw-Golf-4332807_1280.jpg new file mode 100644 index 0000000..69eae2d Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Golf/vw-Golf-4332807_1280.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Golf/vw-Golf-4332807_12801.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Golf/vw-Golf-4332807_12801.jpg new file mode 100644 index 0000000..ac924f9 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Golf/vw-Golf-4332807_12801.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Passat black/VW-passat-768159_1280.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Passat black/VW-passat-768159_1280.jpg new file mode 100644 index 0000000..79c0205 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Passat black/VW-passat-768159_1280.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Passat black/VW-passat-768159_12801.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Passat black/VW-passat-768159_12801.jpg new file mode 100644 index 0000000..aa10ba2 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Passat black/VW-passat-768159_12801.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Passat black/VW-passat-768159_12802.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Passat black/VW-passat-768159_12802.jpg new file mode 100644 index 0000000..7532cc4 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Passat black/VW-passat-768159_12802.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Passat gray/VW-Passat-car-866764_1280.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Passat gray/VW-Passat-car-866764_1280.jpg new file mode 100644 index 0000000..6418fd7 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Passat gray/VW-Passat-car-866764_1280.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Passat gray/VW-Passat-car-866769_1280.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Passat gray/VW-Passat-car-866769_1280.jpg new file mode 100644 index 0000000..1b01f80 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Passat gray/VW-Passat-car-866769_1280.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Passat gray/VW-Passat-car-866769_12801.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Passat gray/VW-Passat-car-866769_12801.jpg new file mode 100644 index 0000000..d034647 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Passat gray/VW-Passat-car-866769_12801.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Polo/VW-Polo-pexels-hellojoshwithers-16625624.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Polo/VW-Polo-pexels-hellojoshwithers-16625624.jpg new file mode 100644 index 0000000..bd6588d Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Polo/VW-Polo-pexels-hellojoshwithers-16625624.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Polo/VW-Polo-pexels-hellojoshwithers-166256241.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Polo/VW-Polo-pexels-hellojoshwithers-166256241.jpg new file mode 100644 index 0000000..a285155 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Polo/VW-Polo-pexels-hellojoshwithers-166256241.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Polo/VW-Polo-pexels-hellojoshwithers-166256242.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Polo/VW-Polo-pexels-hellojoshwithers-166256242.jpg new file mode 100644 index 0000000..d82c8b1 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Polo/VW-Polo-pexels-hellojoshwithers-166256242.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 1/4-1-VW-Touareg-automobile-4061855_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 1/4-1-VW-Touareg-automobile-4061855_1920.jpg new file mode 100644 index 0000000..2297e32 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 1/4-1-VW-Touareg-automobile-4061855_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 1/4-2-VW-Touareg-338895_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 1/4-2-VW-Touareg-338895_1920.jpg new file mode 100644 index 0000000..945ff16 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 1/4-2-VW-Touareg-338895_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 1/4-3-VW-Touareg-automobile-4061855_1920.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 1/4-3-VW-Touareg-automobile-4061855_1920.jpg new file mode 100644 index 0000000..21de263 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 1/4-3-VW-Touareg-automobile-4061855_1920.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 2/5-1-VW-Touareg-pexels-ardit-mbrati-216809103-16646414.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 2/5-1-VW-Touareg-pexels-ardit-mbrati-216809103-16646414.jpg new file mode 100644 index 0000000..269d133 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 2/5-1-VW-Touareg-pexels-ardit-mbrati-216809103-16646414.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 2/5-2-VW-Touareg-pexels-ardit-mbrati-216809103-16646416.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 2/5-2-VW-Touareg-pexels-ardit-mbrati-216809103-16646416.jpg new file mode 100644 index 0000000..b5d7566 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 2/5-2-VW-Touareg-pexels-ardit-mbrati-216809103-16646416.jpg differ diff --git a/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 2/5-3-VW-Touareg-pexels-ardit-mbrati-216809103-16646412.jpg b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 2/5-3-VW-Touareg-pexels-ardit-mbrati-216809103-16646412.jpg new file mode 100644 index 0000000..2e1e7c0 Binary files /dev/null and b/samples/FleetManagement/wwwroot/cars/photos/VW Touareg 2/5-3-VW-Touareg-pexels-ardit-mbrati-216809103-16646412.jpg differ diff --git a/samples/FleetManagement/wwwroot/data/car_images.json b/samples/FleetManagement/wwwroot/data/car_images.json new file mode 100644 index 0000000..74f1190 --- /dev/null +++ b/samples/FleetManagement/wwwroot/data/car_images.json @@ -0,0 +1,182 @@ +{ + "Ford F-150 blue": [ + "Ford-F150-caleb-white-XGJBSkoqX_I-unsplash.jpg", + "Ford-F150-caleb-white-XGJBSkoqX_I-unsplash1.jpg", + "Ford-F150-caleb-white-XGJBSkoqX_I-unsplash2.jpg" + ], + "Ford F-150 red": [ + "Ford-f150-7572360_1920.jpg", + "Ford-f150-7572360_19201.jpg", + "Ford-f150-7572360_19202.jpg" + ], + "Ford Focus blue": [ + "ford-focus-5167838_1280.jpg", + "ford-focus-5167838_12801.jpg", + "ford-focus-5167838_12802.jpg" + ], + "Ford Focus dark gray": [ + "1-1-Ford-Focus-car-3300587_1280.jpg", + "1-2-Ford-Focus-car-3300588_1280.jpg", + "1-3-Ford-Focus-car-3300587_1280.jpg" + ], + "Ford Mustang blue": [ + "Ford-Mustang-automobile-1450573_1920.jpg", + "Ford-Mustang-automobile-1450573_19201.jpg", + "Ford-Mustang-automobile-1450573_19202.jpg" + ], + "Ford Mustang red": [ + "Ford-Mustang-convertible-1630448_1920.jpg", + "Ford-Mustang-convertible-1630448_19201.jpg", + "Ford-Mustang-convertible-1630448_19202.jpg" + ], + "Honda Civic": [ + "honda-civic-4967605_1920.jpg", + "honda-civic-4967605_19201.jpg", + "honda-civic-4967605_19202.jpg" + ], + "Hyundai ix35": [ + "Hyundai-ix35-5505817_1920.jpg", + "Hyundai-ix35-5505817_19201.jpg", + "Hyundai-ix35-5505817_19202.jpg" + ], + "Hyundai Kona": [ + "Hyundai-Kona-electric-4964667_1920.jpg", + "Hyundai-Kona-electric-4964667_19201.jpg", + "Hyundai-Kona-electric-4964667_19202.jpg" + ], + "Kia Ceed red": [ + "Kia-Ceed-car-3305685_1280.jpg", + "Kia-ceed-car-3305686_1920.jpg", + "Kia-Ceed-car-3305699_1280.jpg" + ], + "Kia Ceed white": [ + "Kia-Ceed-car-6097887_1920.jpg", + "Kia-Ceed-car-6097887_19201.jpg", + "Kia-Ceed-car-6097887_19202.jpg" + ], + "Kia EV6 gray": [ + "KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash.jpg", + "KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash1.jpg", + "KIA-EV6-hyundai-motor-group-gKODwMitO-c-unsplash2.jpg" + ], + "Kia EV6 red": [ + "KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash.jpg", + "KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash1.jpg", + "KIA-EV6-hyundai-motor-group-jdjzmbw4GPg-unsplash2.jpg" + ], + "Kia EV6 GT": [ + "KIA-EV6-GT-line edited hyundai-motor-group-ErBFxMkJpKk-unsplash-detail1.jpg", + "KIA-EV6-GT-line edited hyundai-motor-group-ErBFxMkJpKk-unsplash.jpg", + "KIA-EV6-GT-line edited hyundai-motor-group-ErBFxMkJpKk-unsplash2.jpg" + ], + "Kia Soul": [ + "Kia-Soul-car-2441815_1920.jpg", + "Kia-Soul-car-2441815_19201.jpg", + "Kia-Soul-car-2441815_19202.jpg" + ], + "Kia Sportage": [ + "Kia-Sportage-2382086_1920.jpg", + "Kia-Sportage-2382086_19201.jpg", + "Kia-Sportage-2382086_19202.jpg" + ], + "Mazda 3": [ + "mazda-3-7498005_1920.jpg", + "mazda-3-7498005_19201.jpg", + "mazda-3-7498005_19202.jpg" + ], + "Mazda 6": [ + "3-1-Mazda-6-car-6122178_1920.jpg", + "3-2-Mazda-6-car-6122177_1920.jpg", + "3-3-Mazda-6-car-6122177_1920.jpg" + ], + "Mazda MX-5": [ + "2-1-Mazda-MX-5-cabriolet-3627312_1920.jpg", + "2-2-Mazda-MX-5-cabriolet-3708152_1920.jpg", + "2-3-Mazda-MX-5-cabriolet-3708152_1920.jpg" + ], + "Tesla 3 red": [ + "Tesla-3-car-8607713_1920.jpg", + "Tesla-3-car-8607713_19201.jpg", + "Tesla-3-car-8607713_19202.jpg" + ], + "Tesla 3 white 1": [ + "tesla-3-5937063_1920.jpg", + "tesla-3-5937063_19201.jpg", + "tesla-3-5937063_19202.jpg" + ], + "Tesla 3 white 2": [ + "Tesla-3-charlie-deets-AkgALppFIwo-unsplash.jpg", + "Tesla-3-charlie-deets-AkgALppFIwo-unsplash1.jpg", + "Tesla-3-charlie-deets-AkgALppFIwo-unsplash2.jpg" + ], + "Tesla 3 white 3": [ + "Tesla-3-i-m-zion-A-JEMot0hWs-unsplash.jpg", + "Tesla-3-i-m-zion-A-JEMot0hWs-unsplash1.jpg", + "Tesla-3-i-m-zion-A-JEMot0hWs-unsplash2.jpg" + ], + "Toyota Corolla": [ + "toyota-corolla-347288_1920.jpg", + "toyota-corolla-347288_19201.jpg", + "toyota-corolla-347288_19202.jpg" + ], + "Toyota RAV4 1": [ + "Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash.jpg", + "Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash1.jpg", + "Toyota-RAV4-gino-marcelo-hernandez-sanchez-MN0-x2hDNrc-unsplash2.jpg" + ], + "Toyota RAV4 2": [ + "Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash.jpg", + "Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash1.jpg", + "Toyota-RAV4-krish-parmar-PmSwFm4Lw1c-unsplash2.jpg" + ], + "Toyota RAV4 3": [ + "Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash.jpg", + "Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash1.jpg", + "Toyota-RAV4-stephen-andrews-28Lmg9YaTFY-unsplash2.jpg" + ], + "Toyota Tundra": [ + "toyota-tundra-1241658_1920.jpg", + "toyota-tundra-1241658_19201.jpg", + "toyota-tundra-1241658_19202.jpg" + ], + "VW Caddy 1": [ + "VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash.jpg", + "VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash1.jpg", + "VW_Caddy-ollie-walls-jDo2IZm-uFc-unsplash2.jpg" + ], + "VW Caddy 2": [ + "VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-2.jpg", + "VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-21.jpg", + "VW-Caddy-daniil-lyusov-fesux3IvcVo-unsplash-22.jpg" + ], + "VW Golf": [ + "vw-Golf-4332807_1280.jpg", + "vw-Golf-4332807_12801.jpg", + "VW-Golf-car-5671331_1280.jpg" + ], + "VW Passat black": [ + "VW-passat-768159_1280.jpg", + "VW-passat-768159_12801.jpg", + "VW-passat-768159_12802.jpg" + ], + "VW Passat gray": [ + "VW-Passat-car-866764_1280.jpg", + "VW-Passat-car-866769_1280.jpg", + "VW-Passat-car-866769_12801.jpg" + ], + "VW Polo": [ + "VW-Polo-pexels-hellojoshwithers-16625624.jpg", + "VW-Polo-pexels-hellojoshwithers-166256241.jpg", + "VW-Polo-pexels-hellojoshwithers-166256242.jpg" + ], + "VW Touareg 1": [ + "4-1-VW-Touareg-automobile-4061855_1920.jpg", + "4-2-VW-Touareg-338895_1920.jpg", + "4-3-VW-Touareg-automobile-4061855_1920.jpg" + ], + "VW Touareg 2": [ + "5-1-VW-Touareg-pexels-ardit-mbrati-216809103-16646414.jpg", + "5-2-VW-Touareg-pexels-ardit-mbrati-216809103-16646416.jpg", + "5-3-VW-Touareg-pexels-ardit-mbrati-216809103-16646412.jpg" + ] +} diff --git a/samples/FleetManagement/wwwroot/data/car_photo_manifest.json b/samples/FleetManagement/wwwroot/data/car_photo_manifest.json new file mode 100644 index 0000000..b3d3e80 --- /dev/null +++ b/samples/FleetManagement/wwwroot/data/car_photo_manifest.json @@ -0,0 +1,102 @@ +[ + { + "id": "A00101", + "folder": "Ford Focus dark gray" + }, + { + "id": "A00102", + "folder": "Ford Focus blue" + }, + { + "id": "A00103", + "folder": "VW Passat black" + }, + { + "id": "A00104", + "folder": "VW Passat gray" + }, + { + "id": "A00105", + "folder": "VW Golf" + }, + { + "id": "A00106", + "folder": "Kia Ceed white" + }, + { + "id": "A00107", + "folder": "Honda Civic" + }, + { + "id": "A00108", + "folder": "Toyota Corolla" + }, + { + "id": "A00109", + "folder": "Mazda 3" + }, + { + "id": "A00110", + "folder": "Ford Mustang red" + }, + { + "id": "A00111", + "folder": "Toyota RAV4 1" + }, + { + "id": "A00112", + "folder": "Toyota RAV4 2" + }, + { + "id": "A00113", + "folder": "Ford F-150 blue" + }, + { + "id": "A00114", + "folder": "Ford F-150 red" + }, + { + "id": "A00115", + "folder": "Hyundai Kona" + }, + { + "id": "A00116", + "folder": "Hyundai ix35" + }, + { + "id": "A00117", + "folder": "Kia Ceed red" + }, + { + "id": "A00118", + "folder": "Ford Mustang blue" + }, + { + "id": "A00119", + "folder": "Kia EV6 gray" + }, + { + "id": "A00120", + "folder": "Tesla 3 red" + }, + { + "id": "A00121", + "folder": "Kia EV6 red" + }, + { + "id": "A00122", + "folder": "Mazda 6" + }, + { + "id": "A00123", + "folder": "Toyota Tundra" + }, + { + "id": "A00124", + "folder": "VW Touareg 1" + }, + { + "id": "A00125", + "folder": "Kia Sportage" + } +] diff --git a/samples/FleetManagement/wwwroot/exampleJsInterop.js b/samples/FleetManagement/wwwroot/exampleJsInterop.js deleted file mode 100644 index ea8d76a..0000000 --- a/samples/FleetManagement/wwwroot/exampleJsInterop.js +++ /dev/null @@ -1,6 +0,0 @@ -// This is a JavaScript module that is loaded on demand. It can export any number of -// functions, and may import other JavaScript modules if required. - -export function showPrompt(message) { - return prompt(message, 'Type anything here'); -} diff --git a/samples/FleetManagement/wwwroot/location_pin.svg b/samples/FleetManagement/wwwroot/location_pin.svg new file mode 100644 index 0000000..24cce8d --- /dev/null +++ b/samples/FleetManagement/wwwroot/location_pin.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/samples/FleetManagement/wwwroot/people/men/1.jpg b/samples/FleetManagement/wwwroot/people/men/1.jpg new file mode 100644 index 0000000..c87da4b Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/1.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/10.jpg b/samples/FleetManagement/wwwroot/people/men/10.jpg new file mode 100644 index 0000000..64b23ba Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/10.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/11.jpg b/samples/FleetManagement/wwwroot/people/men/11.jpg new file mode 100644 index 0000000..78f1a00b Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/11.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/12.jpg b/samples/FleetManagement/wwwroot/people/men/12.jpg new file mode 100644 index 0000000..7fe953e Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/12.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/13.jpg b/samples/FleetManagement/wwwroot/people/men/13.jpg new file mode 100644 index 0000000..793050e Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/13.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/14.jpg b/samples/FleetManagement/wwwroot/people/men/14.jpg new file mode 100644 index 0000000..28485eb Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/14.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/15.jpg b/samples/FleetManagement/wwwroot/people/men/15.jpg new file mode 100644 index 0000000..fa9b0b4 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/15.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/16.jpg b/samples/FleetManagement/wwwroot/people/men/16.jpg new file mode 100644 index 0000000..c8b10c9 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/16.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/17.jpg b/samples/FleetManagement/wwwroot/people/men/17.jpg new file mode 100644 index 0000000..4582ff9 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/17.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/18.jpg b/samples/FleetManagement/wwwroot/people/men/18.jpg new file mode 100644 index 0000000..ec8efea Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/18.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/19.jpg b/samples/FleetManagement/wwwroot/people/men/19.jpg new file mode 100644 index 0000000..22146cf Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/19.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/2.jpg b/samples/FleetManagement/wwwroot/people/men/2.jpg new file mode 100644 index 0000000..46b50b3 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/2.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/20.jpg b/samples/FleetManagement/wwwroot/people/men/20.jpg new file mode 100644 index 0000000..443ca04 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/20.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/21.jpg b/samples/FleetManagement/wwwroot/people/men/21.jpg new file mode 100644 index 0000000..db7d2e1 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/21.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/22.jpg b/samples/FleetManagement/wwwroot/people/men/22.jpg new file mode 100644 index 0000000..a684a66 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/22.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/23.jpg b/samples/FleetManagement/wwwroot/people/men/23.jpg new file mode 100644 index 0000000..e01c7c3 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/23.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/24.jpg b/samples/FleetManagement/wwwroot/people/men/24.jpg new file mode 100644 index 0000000..1cd8992 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/24.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/25.jpg b/samples/FleetManagement/wwwroot/people/men/25.jpg new file mode 100644 index 0000000..638bba9 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/25.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/26.jpg b/samples/FleetManagement/wwwroot/people/men/26.jpg new file mode 100644 index 0000000..1e540f2 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/26.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/3.jpg b/samples/FleetManagement/wwwroot/people/men/3.jpg new file mode 100644 index 0000000..a1ca2b7 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/3.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/4.jpg b/samples/FleetManagement/wwwroot/people/men/4.jpg new file mode 100644 index 0000000..3d2b1d4 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/4.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/5.jpg b/samples/FleetManagement/wwwroot/people/men/5.jpg new file mode 100644 index 0000000..a925c20 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/5.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/6.jpg b/samples/FleetManagement/wwwroot/people/men/6.jpg new file mode 100644 index 0000000..e2a8a00 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/6.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/7.jpg b/samples/FleetManagement/wwwroot/people/men/7.jpg new file mode 100644 index 0000000..5cc24cf Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/7.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/8.jpg b/samples/FleetManagement/wwwroot/people/men/8.jpg new file mode 100644 index 0000000..79342d9 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/8.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/men/9.jpg b/samples/FleetManagement/wwwroot/people/men/9.jpg new file mode 100644 index 0000000..676b050 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/men/9.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/1.jpg b/samples/FleetManagement/wwwroot/people/women/1.jpg new file mode 100644 index 0000000..11adb72 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/1.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/10.jpg b/samples/FleetManagement/wwwroot/people/women/10.jpg new file mode 100644 index 0000000..9c0db98 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/10.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/11.jpg b/samples/FleetManagement/wwwroot/people/women/11.jpg new file mode 100644 index 0000000..6939e63 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/11.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/12.jpg b/samples/FleetManagement/wwwroot/people/women/12.jpg new file mode 100644 index 0000000..19472d3 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/12.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/13.jpg b/samples/FleetManagement/wwwroot/people/women/13.jpg new file mode 100644 index 0000000..4c4cf0e Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/13.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/14.jpg b/samples/FleetManagement/wwwroot/people/women/14.jpg new file mode 100644 index 0000000..97505f6 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/14.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/15.jpg b/samples/FleetManagement/wwwroot/people/women/15.jpg new file mode 100644 index 0000000..7ba8f35 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/15.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/16.jpg b/samples/FleetManagement/wwwroot/people/women/16.jpg new file mode 100644 index 0000000..52d0986 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/16.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/17.jpg b/samples/FleetManagement/wwwroot/people/women/17.jpg new file mode 100644 index 0000000..119b560 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/17.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/18.jpg b/samples/FleetManagement/wwwroot/people/women/18.jpg new file mode 100644 index 0000000..c6fb88b Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/18.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/19.jpg b/samples/FleetManagement/wwwroot/people/women/19.jpg new file mode 100644 index 0000000..e8cc163 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/19.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/2.jpg b/samples/FleetManagement/wwwroot/people/women/2.jpg new file mode 100644 index 0000000..d2a4dad Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/2.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/20.jpg b/samples/FleetManagement/wwwroot/people/women/20.jpg new file mode 100644 index 0000000..9273d25 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/20.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/21.jpg b/samples/FleetManagement/wwwroot/people/women/21.jpg new file mode 100644 index 0000000..5c4668b Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/21.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/22.jpg b/samples/FleetManagement/wwwroot/people/women/22.jpg new file mode 100644 index 0000000..d8e6acc Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/22.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/23.jpg b/samples/FleetManagement/wwwroot/people/women/23.jpg new file mode 100644 index 0000000..f02a947 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/23.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/24.jpg b/samples/FleetManagement/wwwroot/people/women/24.jpg new file mode 100644 index 0000000..6a65364 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/24.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/25.jpg b/samples/FleetManagement/wwwroot/people/women/25.jpg new file mode 100644 index 0000000..7b04bf0 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/25.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/26.jpg b/samples/FleetManagement/wwwroot/people/women/26.jpg new file mode 100644 index 0000000..5e97b5c Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/26.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/3.jpg b/samples/FleetManagement/wwwroot/people/women/3.jpg new file mode 100644 index 0000000..75c60ae Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/3.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/4.jpg b/samples/FleetManagement/wwwroot/people/women/4.jpg new file mode 100644 index 0000000..22ee31d Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/4.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/5.jpg b/samples/FleetManagement/wwwroot/people/women/5.jpg new file mode 100644 index 0000000..8d913a4 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/5.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/6.jpg b/samples/FleetManagement/wwwroot/people/women/6.jpg new file mode 100644 index 0000000..a85d010 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/6.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/7.jpg b/samples/FleetManagement/wwwroot/people/women/7.jpg new file mode 100644 index 0000000..42e1c5b Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/7.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/8.jpg b/samples/FleetManagement/wwwroot/people/women/8.jpg new file mode 100644 index 0000000..e88ff99 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/8.jpg differ diff --git a/samples/FleetManagement/wwwroot/people/women/9.jpg b/samples/FleetManagement/wwwroot/people/women/9.jpg new file mode 100644 index 0000000..2178980 Binary files /dev/null and b/samples/FleetManagement/wwwroot/people/women/9.jpg differ diff --git a/samples/FleetManagement/wwwroot/scripts/fleet-grid-templates.js b/samples/FleetManagement/wwwroot/scripts/fleet-grid-templates.js new file mode 100644 index 0000000..9577cee --- /dev/null +++ b/samples/FleetManagement/wwwroot/scripts/fleet-grid-templates.js @@ -0,0 +1,41 @@ +(function registerFleetGridTemplates() { + if (!window.igRegisterScript || !window.igTemplating || !window.igTemplating.html) { + setTimeout(registerFleetGridTemplates, 50); + return; + } + + const html = window.igTemplating.html; + + const icons = { + check: html``, + wrench: html``, + delivery: html``, + gitIssue: html`` + }; + + const statusVariant = { "Available": "success", "In Maintenance": "danger", "Active": "info" }; + const statusIcon = { "Available": icons.check, "In Maintenance": icons.wrench, "Active": icons.delivery }; + + window.igRegisterScript("fleetDriverCell", (ctx) => { + const data = ctx.cell.row.data || {}; + const photo = data.driverPhotoUrl || data.DriverPhotoUrl || ""; + const isCurrent = ctx.cell.row.index === 0 && (data.end ?? data.End) === "N/A"; + return html`
${ctx.cell.value}${isCurrent ? html`Current` : ""}
`; + }, false); + + window.igRegisterScript("fleetMakeCell", (ctx) => { + const make = ctx.cell.value; + return html`
${make}
`; + }, false); + + window.igRegisterScript("fleetStatusCell", (ctx) => { + const status = ctx.cell.value; + return html`
${statusIcon[status] || icons.delivery}${status}
`; + }, false); + + window.igRegisterScript("fleetMaintenanceTypeCell", (ctx) => { + const value = ctx.cell.value; + const regular = value === "Regular"; + return html`
${regular ? icons.check : icons.gitIssue}${value}
`; + }, false); +})(); diff --git a/samples/FleetManagement/wwwroot/styles/fleet.css b/samples/FleetManagement/wwwroot/styles/fleet.css new file mode 100644 index 0000000..a5dc3ef --- /dev/null +++ b/samples/FleetManagement/wwwroot/styles/fleet.css @@ -0,0 +1,313 @@ +#fleet-section { + background-color: var(--ig-surface-500); + color: var(--ig-gray-900); + min-height: 100%; +} + +#fleet-section .main-grid { + --ig-size: var(--ig-size-small); +} + +/* The grid generates its row theming from --ig-theme-variant, which the globally-loaded light + grid theme pins to "light" on the grid element, so it paints a white background directly on + the even rows (bypassing the --row-even-background token, which our scoped dark tokens can't + reach anyway). Force the even rows back to the dark surface so they match the odd rows -- + high specificity + !important to beat the grid's generated rule. */ +#fleet-section .main-grid .igx-grid__tr.igx-grid__tr--even { + background: var(--ig-gray-50) !important; +} + +/* Match the WC header sort indicator size (15px) — the grid otherwise renders it at the + default 24px, which makes the small header look oversized. */ +#fleet-section .main-grid igx-grid-header igx-icon { + font-size: 15px; + width: 15px; + height: 15px; +} + +#fleet-section [id^="host-"] { + width: 100%; +} + +#fleet-section igc-tabs::part(inner) { + width: 100%; +} + +#fleet-section igc-tab::part(tab-body) { + width: 100%; +} + +#fleet-section igc-tab[selected]::part(tab-header) { + color: var(--ig-primary-500); +} + +#fleet-section .igx-grid-toolbar__title { + flex: 0 0 auto; + /* Show the "Fleet Management" title (WC parity) in the dark theme's light text colour; + the grid's default title colour is dark and would be invisible on the dark surface. */ + color: var(--ig-gray-900); +} + +#fleet-section .igx-grid-toolbar__custom-content { + justify-content: flex-start; + color: #e0e0e0; +} + +#fleet-section .clear-sort-btn { + margin-left: auto; +} + +#fleet-section igc-grid { + --ig-size: var(--ig-size-small); +} + +#fleet-section .clear-sort-btn .toolbar-btn-icon { + display: inline-flex; + align-items: center; + margin-right: 2px; +} + +#fleet-section .clear-sort-btn .toolbar-btn-icon svg { + width: 16px; + height: 16px; + fill: currentColor; +} + +#fleet-section .cell-flex { + display: flex; + align-items: center; + gap: 0.5rem; +} + +#fleet-section .driver-avatar, +#fleet-section .logo-avatar { + --size: 22px; + --ig-size: var(--ig-size-small); +} + +#fleet-section .driver-badge { + --ig-size: var(--ig-size-small); +} + +#fleet-section .driver-badge::part(base) { + background: var(--ig-success-500); +} + +#fleet-section .current-badge-text { + margin: 0 8px; +} + +#fleet-section .status-icon { + display: inline-flex; + align-items: center; + justify-content: center; +} + +#fleet-section .status-icon svg { + width: 14px; + height: 14px; + fill: #000000; +} + +#fleet-section .status-value { + white-space: nowrap; +} + +#fleet-section .detail-tabs { + width: 100%; +} + +#fleet-section .details-container { + display: flex; + align-items: flex-start; + padding: 16px; + width: 100%; +} + +#fleet-section .carousel-container { + width: 420px; + height: 240px; + flex: 0 0 420px; +} + +#fleet-section .carousel-container igc-carousel { + display: block; + width: 100%; + height: 100%; +} + +#fleet-section .image-container { + width: 100%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; + overflow: hidden; +} + +#fleet-section .image-container img { + width: 100%; + height: 100%; + object-fit: cover; + border-radius: 8px; +} + +#fleet-section .details-table { + display: flex; + flex-direction: row; + width: calc(100% * (2 / 3)); + height: auto; + justify-content: space-around; +} + +#fleet-section .detail-block-container { + display: flex; + flex-direction: row; + justify-content: space-around; + align-items: flex-start; + width: 50%; +} + +#fleet-section .detail-category-container, +#fleet-section .detail-content-container { + width: 50%; +} + +#fleet-section .detail-category-container { + padding-left: 25px; +} + +#fleet-section .detail-item { + padding: 5px 0; + font-size: 0.8125rem; + border-bottom: 1px solid var(--ig-gray-300); + white-space: nowrap; +} + +#fleet-section .detail-category { + font-weight: 600; +} + +#fleet-section .detail-value { + opacity: 0.85; +} + +#fleet-section .charts-dashboard { + display: flex; + flex-wrap: wrap; + gap: 1rem; + padding: 1rem; + height: 460px; +} + +#fleet-section .chart-card { + flex: 1 1 0; + min-width: 240px; + display: flex; + flex-direction: column; +} + +#fleet-section .chart-card-wide { + flex-basis: 100%; +} + +#fleet-section .cost-dashboard { + display: grid; + grid-template-columns: 1fr 2.5fr; + grid-template-rows: 1fr 1fr; + gap: 1rem; + height: 480px; +} + +#fleet-section .cost-dashboard .pie-cell { + grid-column: 1; + grid-row: 1; +} + +#fleet-section .cost-dashboard .area-cell { + grid-column: 1; + grid-row: 2; +} + +#fleet-section .cost-dashboard .column-cell { + grid-column: 2; + grid-row: 1 / span 2; +} + +#fleet-section .cost-dashboard .chart-card { + min-width: 0; +} + +#fleet-section .chart-title { + font-weight: 600; +} + +#fleet-section .chart-header { + display: flex; + justify-content: space-between; + align-items: center; + gap: 1rem; + margin-bottom: 0.5rem; + min-height: 48px; +} + +#fleet-section .chart-period { + width: 160px; + flex-shrink: 0; +} + +#fleet-section .chart-legend { + display: flex; + gap: 1rem; +} + +#fleet-section .legend-item { + display: flex; + align-items: center; + gap: 0.4rem; + font-size: 0.8125rem; +} + +#fleet-section .legend-swatch { + width: 12px; + height: 12px; + border-radius: 2px; + display: inline-block; +} + +#fleet-section .legend-2023 { + background: #7ED957; +} + +#fleet-section .legend-2024 { + background: #9B6DC6; +} + +#fleet-section .chart-host { + flex: 1; + min-height: 0; +} + +#fleet-section .cost-dashboard .chart-host { + border: 1px solid var(--ig-gray-400); + border-radius: 6px; + padding: 6px; +} + +#fleet-section .utilization-card { + align-items: flex-start; + gap: 0.25rem; + padding: 15px; + border-radius: 6px; + border: 1px solid var(--ig-gray-400); +} + +#fleet-section .utilization-title { + margin: 0; + font-size: 1.75rem; + font-weight: 400; +} + +#fleet-section .utilization-card .chart-host { + width: 100%; +} diff --git a/samples/HRPortal/ExampleJsInterop.cs b/samples/HRPortal/ExampleJsInterop.cs deleted file mode 100644 index e578f43..0000000 --- a/samples/HRPortal/ExampleJsInterop.cs +++ /dev/null @@ -1,32 +0,0 @@ -using Microsoft.JSInterop; - -namespace HRPortal -{ - // This class provides an example of how JavaScript functionality can be wrapped - // in a .NET class for easy consumption. The associated JavaScript module is - // loaded on demand when first needed. - // - // This class can be registered as scoped DI service and then injected into Blazor - // components for use. - - public class ExampleJsInterop(IJSRuntime jsRuntime) : IAsyncDisposable - { - private readonly Lazy> moduleTask = new(() => jsRuntime.InvokeAsync( - "import", "./_content/HRPortal/exampleJsInterop.js").AsTask()); - - public async ValueTask Prompt(string message) - { - var module = await moduleTask.Value; - return await module.InvokeAsync("showPrompt", message); - } - - public async ValueTask DisposeAsync() - { - if (moduleTask.IsValueCreated) - { - var module = await moduleTask.Value; - await module.DisposeAsync(); - } - } - } -} diff --git a/samples/HRPortal/HRPortal.csproj b/samples/HRPortal/HRPortal.csproj index fd2f805..8e22ef3 100644 --- a/samples/HRPortal/HRPortal.csproj +++ b/samples/HRPortal/HRPortal.csproj @@ -12,7 +12,7 @@ - + diff --git a/samples/HRPortal/HRPortalComponent.razor b/samples/HRPortal/HRPortalComponent.razor index 78ae213..d5f4b70 100644 --- a/samples/HRPortal/HRPortalComponent.razor +++ b/samples/HRPortal/HRPortalComponent.razor @@ -8,7 +8,7 @@
-
+
@if (isLoading) {
@@ -31,7 +31,7 @@ ChildDataKey="Employees" AllowFiltering="true" FilterMode="@FilterMode.ExcelStyleFilter" - RowSelection="@GridSelectionMode.Multiple" + RowSelection="@GridSelectionMode.MultipleCascade" Height="calc(100vh - 200px)" SortingExpressionsChange="OnSortingExpressionsChange" @ref="treeGrid"> @@ -41,6 +41,7 @@ @if (isSorted) { + Clear Sort } @@ -51,16 +52,16 @@ - - - - + + - - - + + }
@@ -82,7 +83,8 @@ { "linkedin", "mail", - "tel" + "tel", + "close" }; @@ -92,15 +94,28 @@ isLoading = false; } - protected override void OnAfterRender(bool firstRender) + protected override async Task OnAfterRenderAsync(bool firstRender) { - if (this.IconRef != null && firstRender) + if (firstRender) { - this.IconRef.EnsureReady().ContinueWith(new Action((e) => + // Re-theme this sample to Fluent by full-scoping the stock theme (tokens AND + // component rules) to #fluent-section -- the third arg `true` opts into full scope. + // Tokens-only leaves the toolbar buttons, header weight and checkbox styled by the + // global Material theme; the full Fluent rules give WC parity (black square toolbar + // buttons, bold headers, thin dark checkbox). scopeThemeToElement dedupes on remount. + await JS.InvokeVoidAsync("scopeThemeToElement", + "_content/IgniteUI.Blazor/themes/light/fluent.css", "#fluent-section", true); + await JS.InvokeVoidAsync("scopeThemeToElement", + "_content/IgniteUI.Blazor/themes/grid/light/fluent.css", "#fluent-section", true); + + if (this.IconRef != null) { - this.RegisterCountryIconsAsync(); - this.RegisterContactIconsAsync(); - })); + this.IconRef.EnsureReady().ContinueWith(new Action((e) => + { + this.RegisterCountryIconsAsync(); + this.RegisterContactIconsAsync(); + })); + } } } @@ -139,6 +154,3 @@ } } - - - \ No newline at end of file diff --git a/samples/HRPortal/wwwroot/background.png b/samples/HRPortal/wwwroot/background.png deleted file mode 100644 index e15a3bd..0000000 Binary files a/samples/HRPortal/wwwroot/background.png and /dev/null differ diff --git a/samples/HRPortal/wwwroot/exampleJsInterop.js b/samples/HRPortal/wwwroot/exampleJsInterop.js deleted file mode 100644 index ea8d76a..0000000 --- a/samples/HRPortal/wwwroot/exampleJsInterop.js +++ /dev/null @@ -1,6 +0,0 @@ -// This is a JavaScript module that is loaded on demand. It can export any number of -// functions, and may import other JavaScript modules if required. - -export function showPrompt(message) { - return prompt(message, 'Type anything here'); -} diff --git a/samples/HRPortal/wwwroot/scripts/hr-templates.js b/samples/HRPortal/wwwroot/scripts/hr-templates.js index 54e9824..1e50599 100644 --- a/samples/HRPortal/wwwroot/scripts/hr-templates.js +++ b/samples/HRPortal/wwwroot/scripts/hr-templates.js @@ -1,57 +1,47 @@ -function avatarCellTemplate(ctx) { +(function registerHrTemplates() { + if (!window.igRegisterScript || !window.igTemplating || !window.igTemplating.html) { + setTimeout(registerHrTemplates, 50); + return; + } const html = window.igTemplating.html; - const data = ctx.cell.row.data; - const pictureUrl = data.Picture - ? `_content/HRPortal/public/${data.Picture}` - : ''; - return html` -
- - ${data.Name || ''} -
- `; -} + window.igRegisterScript("AvatarCellTemplate", (ctx) => { + const data = ctx.cell.row.data; + const pictureUrl = data.Picture ? `_content/HRPortal/public/${data.Picture}` : ""; + return html` +
+ + ${data.Name || ""} +
`; + }, false); -function countryFlagTemplate(ctx) { - const html = window.igTemplating.html; - const data = ctx.cell.row.data; - const country = data.Country || ''; - const location = data.Location || ''; - const flagUrl = country - ? `_content/HRPortal/public/images/countries/${country}.svg` - : ''; - - return html` -
- ${flagUrl ? html`` : ''} - ${location}${country ? `, ${country}` : ''} -
- `; -} - - -function contactCellTemplate(ctx) { - const html = window.igTemplating.html; - const data = ctx.cell.row.data; - const email = data.Contacs; - const phone = data.Phone; + window.igRegisterScript("CountryFlagTemplate", (ctx) => { + const data = ctx.cell.row.data; + const country = data.Country || ""; + const location = data.Location || ""; + return html` +
+ ${country ? html`` : ""} + ${location}${country ? `, ${country}` : ""} +
`; + }, false); - return html` -
- - - - - - - - - -
- `; -} + window.igRegisterScript("HrDateTemplate", (ctx) => { + const v = ctx.cell.row.data.HireDate; + if (!v) return html``; + const d = new Date(v); + return html`${isNaN(d.getTime()) ? v : d.toISOString().split("T")[0]}`; + }, false); -igRegisterScript("AvatarCellTemplate", avatarCellTemplate, false); -igRegisterScript("CountryFlagTemplate", countryFlagTemplate, false); -igRegisterScript("ContactCellTemplate", contactCellTemplate, false); \ No newline at end of file + window.igRegisterScript("ContactCellTemplate", (ctx) => { + const data = ctx.cell.row.data; + const email = data.Contacts; + const phone = data.Phone; + return html` +
+ + + +
`; + }, false); +})(); diff --git a/samples/HRPortal/wwwroot/styles/hr-portal.css b/samples/HRPortal/wwwroot/styles/hr-portal.css index d4f617b..4c38492 100644 --- a/samples/HRPortal/wwwroot/styles/hr-portal.css +++ b/samples/HRPortal/wwwroot/styles/hr-portal.css @@ -1,39 +1,73 @@ -#fluent-section { - @import '_content/IgniteUI.Blazor/themes/grid/light/fluent.css'; +#fluent-section .hr-container { + height: calc(100vh - 80px); + width: 100%; } -.employee-cell { - display: flex; - align-items: center; - gap: 8px; +#fluent-section igc-tree-grid { + --ig-size: var(--ig-size-medium); + --row-even-background: #ffffff; } -.employee-cell igc-avatar { - flex-shrink: 0; - --ig-size: var(--ig-size-small); + +#fluent-section .employee-cell { + display: flex; + align-items: center; + gap: 8px; +} + +#fluent-section .employee-cell igc-avatar { + flex-shrink: 0; + --ig-size: var(--ig-size-small); +} + +#fluent-section .employee-cell igc-avatar::part(base) { + --size: 28px; } -.employee-cell span { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + +#fluent-section .employee-cell span { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } -.location-cell { - display: flex; - align-items: center; - gap: 8px; +#fluent-section .location-cell { + display: flex; + align-items: center; + gap: 8px; } -.location-cell igc-icon { - width: 24px; - height: 18px; - flex-shrink: 0; + +#fluent-section .location-cell igc-icon { + width: 18px; + height: 14px; + flex-shrink: 0; + border-radius: 1px; + box-shadow: var(--ig-elevation-1); + overflow: hidden; } -.location-cell span { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + +#fluent-section .location-cell span { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } -.igx-grid { - --ig-size: var(--ig-size-medium); - --row-even-background: #ffffff; -} \ No newline at end of file +#fluent-section .center-content { + display: flex; + justify-content: center; + align-items: center; + height: 100%; + gap: 4px; +} + +#fluent-section .center-content.small { + --ig-size: var(--ig-size-small); +} + +#fluent-section .center-content a { + display: inline-flex; + color: var(--ig-primary-500); +} + +#fluent-section .center-content igc-icon-button::part(base), +#fluent-section .center-content igc-icon-button::part(icon) { + color: var(--ig-primary-500); +} diff --git a/samples/SalesGrid/ExampleJsInterop.cs b/samples/SalesGrid/ExampleJsInterop.cs deleted file mode 100644 index 5630056..0000000 --- a/samples/SalesGrid/ExampleJsInterop.cs +++ /dev/null @@ -1,32 +0,0 @@ -using Microsoft.JSInterop; - -namespace SalesGrid -{ - // This class provides an example of how JavaScript functionality can be wrapped - // in a .NET class for easy consumption. The associated JavaScript module is - // loaded on demand when first needed. - // - // This class can be registered as scoped DI service and then injected into Blazor - // components for use. - - public class ExampleJsInterop(IJSRuntime jsRuntime) : IAsyncDisposable - { - private readonly Lazy> moduleTask = new(() => jsRuntime.InvokeAsync( - "import", "./_content/SalesGrid/exampleJsInterop.js").AsTask()); - - public async ValueTask Prompt(string message) - { - var module = await moduleTask.Value; - return await module.InvokeAsync("showPrompt", message); - } - - public async ValueTask DisposeAsync() - { - if (moduleTask.IsValueCreated) - { - var module = await moduleTask.Value; - await module.DisposeAsync(); - } - } - } -} diff --git a/samples/SalesGrid/Models/PivotSalesData.cs b/samples/SalesGrid/Models/PivotSalesData.cs new file mode 100644 index 0000000..db4873e --- /dev/null +++ b/samples/SalesGrid/Models/PivotSalesData.cs @@ -0,0 +1,27 @@ +using System.Text.Json.Serialization; + +namespace SalesGrid.Models; + +public class PivotSalesDataItem +{ + [JsonPropertyName("Country")] + public string Country { get; set; } = ""; + + [JsonPropertyName("Store")] + public string Store { get; set; } = ""; + + [JsonPropertyName("Brand")] + public string Brand { get; set; } = ""; + + [JsonPropertyName("Sale")] + public double Sale { get; set; } + + [JsonPropertyName("Cost")] + public double Cost { get; set; } + + [JsonPropertyName("Date")] + public string Date { get; set; } = ""; + + [JsonIgnore] + public double Profit => Sale - Cost; +} diff --git a/samples/SalesGrid/Models/SalesData.cs b/samples/SalesGrid/Models/SalesData.cs deleted file mode 100644 index f3ea933..0000000 --- a/samples/SalesGrid/Models/SalesData.cs +++ /dev/null @@ -1,63 +0,0 @@ -using System.Globalization; -using System.Text.Json; -using System.Text.Json.Serialization; - -namespace SalesGrid.Models; - -// Matches the source dataset at -// https://www.infragistics.com/grid-examples-data/data/sales/sales.json -public class SalesData -{ - [JsonPropertyName("Store")] - public string? Store { get; set; } - - [JsonPropertyName("Brand")] - public string? Brand { get; set; } - - [JsonPropertyName("Country")] - public string? Country { get; set; } - - [JsonPropertyName("Sale")] - public double Sale { get; set; } - - [JsonPropertyName("Cost")] - public double Cost { get; set; } - - [JsonPropertyName("Date")] - [JsonConverter(typeof(FlexibleDateTimeConverter))] - public DateTime Date { get; set; } - - // Derived locally (not present in the source JSON). - [JsonIgnore] - public double Profit { get; set; } -} - -// The source dates use the non-ISO "M/d/yyyy" form (e.g. "2/9/2018"), which the -// default System.Text.Json DateTime reader rejects. This converter accepts both. -public class FlexibleDateTimeConverter : JsonConverter -{ - private static readonly string[] Formats = - { - "M/d/yyyy", "MM/dd/yyyy", "yyyy-MM-dd", "yyyy-MM-ddTHH:mm:ss.fffZ" - }; - - public override DateTime Read(ref Utf8JsonReader reader, Type typeToConvert, JsonSerializerOptions options) - { - var s = reader.GetString(); - if (DateTime.TryParse(s, CultureInfo.InvariantCulture, DateTimeStyles.AssumeUniversal | DateTimeStyles.AdjustToUniversal, out var dt)) - { - return dt; - } - foreach (var f in Formats) - { - if (DateTime.TryParseExact(s, f, CultureInfo.InvariantCulture, DateTimeStyles.None, out dt)) - { - return dt; - } - } - return default; - } - - public override void Write(Utf8JsonWriter writer, DateTime value, JsonSerializerOptions options) - => writer.WriteStringValue(value.ToString("yyyy-MM-dd", CultureInfo.InvariantCulture)); -} diff --git a/samples/SalesGrid/SalesGrid.csproj b/samples/SalesGrid/SalesGrid.csproj index fd2f805..8033862 100644 --- a/samples/SalesGrid/SalesGrid.csproj +++ b/samples/SalesGrid/SalesGrid.csproj @@ -4,6 +4,11 @@ net10.0 enable enable + + $(NoWarn);BL0005 @@ -12,7 +17,7 @@ - + diff --git a/samples/SalesGrid/SalesGridComponent.razor b/samples/SalesGrid/SalesGridComponent.razor index 5842399..0111d40 100644 --- a/samples/SalesGrid/SalesGridComponent.razor +++ b/samples/SalesGrid/SalesGridComponent.razor @@ -1,84 +1,207 @@ -@using SalesGrid.Services +@using System.Linq @using SalesGrid.Models +@using SalesGrid.Services @using IgniteUI.Blazor.Controls -@inject SalesService SalesService -@implements IDisposable +@using Microsoft.JSInterop +@inject SalesDataService SalesData +@inject HttpClient Http +@inject IJSRuntime JS -
- @if (isLoading) - { -
-