MudBlazor

This commit is contained in:
Mike Phares 2023-01-19 19:40:39 -07:00
parent 10c823dca8
commit 8c2a6676b5
9 changed files with 96 additions and 48 deletions

View File

@ -5,6 +5,12 @@
<ImplicitUsings>enable</ImplicitUsings>
<RuntimeIdentifier>win-x64</RuntimeIdentifier>
</PropertyGroup>
<ItemGroup>
<PackageReference Include="MudBlazor" Version="6.1.7" />
<PackageReference Include="Serilog.Sinks.BrowserConsole" Version="1.0.0" />
<PackageReference Include="Serilog.Sinks.BrowserHttp" Version="1.0.0-dev-00032" />
<PackageReference Include="System.Net.Http.Json" Version="7.0.0" />
</ItemGroup>
<ItemGroup>
<ProjectReference Include="..\Shared\OI.Metrology.Shared.csproj" />
</ItemGroup>

View File

@ -1,6 +1,7 @@
@page "/AwaitingDisposition"
@using Microsoft.AspNetCore.Components.Web
@using MudBlazor
@namespace OI.Metrology.ClientHub.Pages
@ -11,12 +12,12 @@
<table id="grid"></table>
</div>
<div class="row" style="margin-top: 10px; margin-bottom: 20px;">
<div class="row" style="margin-top: 10px; margin-bottom: 20px; min-height:480px;">
<div class="col-xs-1">
<input type="button" id="OpenButton" value="Open" />
<MudButton Variant="Variant.Filled" Color="Color.Info" id="OpenButton">Open</MudButton>
</div>
<div class="col-xs-1">
<input type="button" id="RefreshButton" value="Refresh" />
<MudButton Variant="Variant.Filled" Color="Color.Primary" id="RefreshButton">Refresh</MudButton>
</div>
</div>

View File

@ -10,7 +10,7 @@
<hr />
<form asp-controller="Export" asp-action="ExportData" method="post" class="form-inline">
<form asp-controller="Export" asp-action="ExportData" method="post" class="form-inline" style="min-height:480px;">
<div class="form-group">
<label for="ToolType">Tool Type</label>
<div class="form-control" id="ToolType" name="ToolType"></div>

View File

@ -19,7 +19,7 @@
</tr>
</table>
<table width="100%" height="80%">
<table width="100%" height="80%" style="min-height:480px;">
<tr>
<td width="50%">
<table id="HeaderGrid"></table>

View File

@ -1,6 +1,7 @@
@page "/RunInfo/{Model?}"
@using Microsoft.AspNetCore.Components.Web
@using MudBlazor
@namespace OI.Metrology.ClientHub.Pages
@ -24,7 +25,7 @@
<div class="form-control mb-2 mr-sm-2" id="EndTime"></div>
</div>&nbsp;&nbsp;
<div class="form-group">
<input class="btn btn-primary" type="button" value="Load Headers" id="LoadHeadersButton" />
<MudButton Variant="Variant.Filled" Color="Color.Info" id="LoadHeadersButton">Load Headers</MudButton>
</div>&nbsp;&nbsp;
<div class="form-group">
<label class="form-check-label" for="chkAutoRefresh">
@ -41,10 +42,10 @@
<div class="row" style="margin-top: 10px; margin-bottom: 20px;">
<div class="col-xs-1">
<input type="button" class="btn" id="GetDataButton" value="Get Data" disabled />
<MudButton Variant="Variant.Filled" Color="Color.Info" id="GetDataButton" Disabled="true">Get Data</MudButton>
</div>
<div class="col-xs-1">
<input type="button" class="btn" id="ReviewButton" value="Review" disabled />
<MudButton Variant="Variant.Filled" Color="Color.Secondary" id="ReviewButton" Disabled="true">Review</MudButton>
</div>
</div>
@ -57,7 +58,7 @@
</div>
<div id="ExportDiv" style="margin-top: 10px;" hidden>
<input type="button" value="Send to OpenInsight" id="OIExportButton" />
<MudButton Variant="Variant.Filled" Color="Color.Warning" id="OIExportButton">Send to OpenInsight</MudButton>
<span id="OIExportResult" style="margin-left: 10px; font-weight: bold; color: #366b02;"></span>
</div>

View File

@ -1,7 +1,6 @@
@page "/"
@model OI.Metrology.ClientHub.Pages.Host
@using OI.Metrology.ClientHub.Models
@using Microsoft.AspNetCore.Components.Web
@namespace OI.Metrology.ClientHub.Pages
@ -25,6 +24,7 @@
<link rel="icon" type="image/png" href="favicon.png" />
<link rel="apple-touch-icon" sizes="512x512" href="icon-512.png" />
<link rel="apple-touch-icon" sizes="192x192" href="icon-192.png" />
<link href="_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" />
<component type="typeof(HeadOutlet)" render-mode="ServerPrerendered" />
@ -104,6 +104,7 @@
</div>
<script src="_framework/blazor.server.js"></script>
<script src="_content/MudBlazor/MudBlazor.min.js"></script>
<script src="js/bootstrap.min.js" type="text/javascript" asp-append-version="true"></script>
<script src="js/respond.min.js" type="text/javascript" asp-append-version="true"></script>
</body>

View File

@ -1,5 +1,8 @@
using MudBlazor.Services;
using OI.Metrology.ClientHub.Data;
using OI.Metrology.ClientHub.Models;
using Serilog;
using Serilog.Core;
namespace OI.Metrology.ClientHub;
@ -8,34 +11,51 @@ internal class Program
private static void Main(string[] args)
{
WebApplicationBuilder builder = WebApplication.CreateBuilder(args);
AppSettings appSettings = Models.Binder.AppSettings.Get(builder.Configuration);
// Add services to the container.
_ = builder.Services.AddRazorPages();
_ = builder.Services.AddServerSideBlazor();
_ = builder.Services.AddSingleton(_ => appSettings);
_ = builder.Services.AddSingleton<WeatherForecastService>();
WebApplication app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
LoggingLevelSwitch levelSwitch = new();
LoggerConfiguration loggerConfiguration = new();
// _ = loggerConfiguration.WriteTo.BrowserConsole();
// _ = loggerConfiguration.MinimumLevel.ControlledBy(levelSwitch);
// _ = loggerConfiguration.Enrich.WithProperty("InstanceId", Guid.NewGuid().ToString("n"));
// _ = loggerConfiguration.WriteTo.BrowserHttp($"{apiUrl}ingest", controlLevelSwitch: levelSwitch);
Log.Logger = loggerConfiguration.CreateLogger();
Serilog.ILogger log = Log.ForContext<Program>();
try
{
_ = app.UseExceptionHandler("/Error");
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
_ = app.UseHsts();
AppSettings appSettings = Models.Binder.AppSettings.Get(builder.Configuration);
// Add services to the container.
_ = builder.Services.AddRazorPages();
_ = builder.Services.AddMudServices();
_ = builder.Services.AddServerSideBlazor();
_ = builder.Services.AddSingleton(_ => appSettings);
_ = builder.Services.AddSingleton<WeatherForecastService>();
_ = builder.Services.AddScoped(serviceProvider => new HttpClient { BaseAddress = new Uri(appSettings.ApiUrl) });
WebApplication app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
_ = app.UseExceptionHandler("/Error");
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
_ = app.UseHsts();
}
_ = app.UseHttpsRedirection();
_ = app.UseStaticFiles();
_ = app.UseRouting();
_ = app.MapBlazorHub();
_ = app.MapFallbackToPage("/_Host");
app.Run();
}
catch (Exception ex)
{
log.Fatal(ex, "An exception occurred while creating the WASM host");
throw;
}
_ = app.UseHttpsRedirection();
_ = app.UseStaticFiles();
_ = app.UseRouting();
_ = app.MapBlazorHub();
_ = app.MapFallbackToPage("/_Host");
app.Run();
}
}

View File

@ -1,14 +1,14 @@
@inherits LayoutComponentBase
@namespace OI.Metrology.ClientHub.Shared
@using MudBlazor
<PageTitle>ClientHub</PageTitle>
<MudDialogProvider />
<MudSnackbarProvider />
<div class="page">
<!--div class="sidebar">
<NavMenu />
</div-->
<MudThemeProvider @ref="@_MudThemeProvider" @bind-IsDarkMode="@_IsDarkMode" />
<main>
@Body
</main>
</div>
<MudPaper Style="padding:18px;">
@Body
</MudPaper>
<MudSwitch @bind-Checked="@_IsDarkMode" Color="Color.Primary" Class="ma-4" T="bool" Label="Toggle Light/Dark Mode" />

View File

@ -1,4 +1,23 @@
namespace OI.Metrology.ClientHub.Shared;
using MudBlazor;
namespace OI.Metrology.ClientHub.Shared;
public partial class MainLayout
{ }
{
bool _DrawerOpen = true;
private bool _IsDarkMode;
private MudThemeProvider? _MudThemeProvider;
void DrawerToggle() => _DrawerOpen = !_DrawerOpen;
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender && _MudThemeProvider is not null)
{
_IsDarkMode = await _MudThemeProvider.GetSystemPreference();
StateHasChanged();
}
}
}