[NEW-FEATURE] Extend Diagnostics View in Blazor

.gitignore

@@ -237,3 +237,4 @@ nugets/
 
 # VSCode
 .vscode/
+src/TcOpen.Hammer/Logs/log20230925.txt

global.json

@@ -0,0 +1,5 @@
+{
+    "sdk": {
+        "version": "5.0.408"
+    }
+}

src/TcOpen.Hammer/PlcHammer.Hmi.Blazor/Pages/DiagnosticsAlternative.razor

@@ -0,0 +1,15 @@
+@page "/diagnostics-alternative"
+
+<RenderableContentControl Context="@Entry.PlcHammer.TECH_MAIN._app" Presentation="DiagnosticsAlternative" />
+
+
+@code {
+
+    protected override void OnInitialized()
+    {
+        TcoDiagnosticsAlternativeView.SetDefaultCategoryFilter(eMessageCategory.Info);
+        TcoDiagnosticsAlternativeView.SetDiagnosticsUpdateInterval(500);  
+        TcoDiagnosticsAlternativeView.SetDefaultDepth(11);
+        base.OnInitialized();
+    }
+}

src/TcOpen.Hammer/PlcHammer.Hmi.Blazor/Pages/_Host.cshtml

@@ -16,6 +16,8 @@
     <link href="PlcHammer.Hmi.Blazor.styles.css" rel="stylesheet" />
     <link rel="stylesheet" href="/_content/Inxton.Vortex.Presentation.Controls.Blazor-experimental/css/inxton-bootstrap.min.css">
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.12.0/css/all.css">
+    <link href="YourLibraryName.styles.css" rel="stylesheet">
+    <link href="path_to_bootstrap.min.css" rel="stylesheet" integrity="if_needed" />
 </head>
 
 
@@ -37,6 +39,8 @@
     <script src="/_content/Inxton.Vortex.Presentation.Controls.Blazor-experimental/js/inxton-bootstrap.bundle.min.js"></script>
     <script src="/_content/Inxton.Vortex.Presentation.Controls.Blazor-experimental/js/jquery-3.6.0.min.js"></script>
     <script src="_framework/blazor.server.js"></script>
+    <script src="_content/BlazorStrap/popper.min.js"></script>
+    <script src="_content/BlazorStrap/blazorstrap.js"></script>
 </body>
 </html>
 

src/TcOpen.Hammer/PlcHammer.Hmi.Blazor/PlcHammer.Hmi.Blazor.csproj

@@ -9,14 +9,18 @@
 
   <ItemGroup>
     <PackageReference Include="Inxton.Vortex.Presentation.Controls.Blazor-experimental" Version="2.0.0" />
-    <PackageReference Include="Microsoft.AspNetCore.Diagnostics.EntityFrameworkCore" Version="5.0.4" />
-    <PackageReference Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="5.0.4" />
-    <PackageReference Include="Microsoft.AspNetCore.Identity.UI" Version="5.0.4" />
-    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="5.0.4" />
-    <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="5.0.4" />
-    <PackageReference Include="Serilog.Sinks.Notepad" Version="2.0.0" />
+    <PackageReference Include="Microsoft.AspNetCore.Diagnostics.EntityFrameworkCore" Version="5.0.17" />
+    <PackageReference Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="5.0.17" />
+    <PackageReference Include="Microsoft.AspNetCore.Identity.UI" Version="5.0.17" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="5.0.17" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="5.0.17">
+      <PrivateAssets>all</PrivateAssets>
+      <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
+    </PackageReference>
+    <PackageReference Include="Serilog.Sinks.MongoDB" Version="5.3.1" />
+    <PackageReference Include="Serilog.Sinks.Notepad" Version="3.0.0" />
     <PackageReference Include="Serilog.Sinks.TextWriter" Version="2.1.0" />
-	<PackageReference Include="Serilog.Enrichers.Environment" Version="2.2.0" />
+	<PackageReference Include="Serilog.Enrichers.Environment" Version="2.3.0" />
   </ItemGroup>
 
   <ItemGroup>

src/TcOpen.Hammer/PlcHammer.Hmi.Blazor/Shared/NavMenu.razor

@@ -32,6 +32,11 @@
                 <span class="oi oi-plus" aria-hidden="true"></span> Diagnostics
             </NavLink>
         </li>
+        <li class="nav-item px-3">
+            <NavLink class="nav-link" href="diagnostics-alternative" Match="NavLinkMatch.All">
+                <span class="oi oi-plus" aria-hidden="true"></span> Diagnostics Alternative
+            </NavLink>
+        </li>
         <li class="nav-item px-3">
             <NavLink class="nav-link" href="security" Match="NavLinkMatch.All">
                 <span class="oi oi-plus" aria-hidden="true"></span> Security

src/TcOpen.Hammer/PlcHammer.Hmi.Blazor/Startup.cs

@@ -1,3 +1,5 @@
+using BlazorStrap;
+
 using Microsoft.AspNetCore.Builder;
 using Microsoft.AspNetCore.Components;
 using Microsoft.AspNetCore.Components.Authorization;
@@ -31,20 +33,32 @@
 using TcOpen.Inxton.Local.Security.Blazor.Services;
 using TcOpen.Inxton.Local.Security.Blazor.Users;
 using TcOpen.Inxton.TcoCore.Blazor.Extensions;
+using TcOpen.Inxton.TcoCore.Blazor.TcoDiagnosticsAlternative.Configure;
+using TcOpen.Inxton.TcoCore.Blazor.TcoDiagnosticsAlternative.Services;
 using TcOpen.Inxton.TcoCore.Blazor.TcoDialog.Hubs;
 using Vortex.Presentation.Blazor.Services;
 
+using static TcoCore.TcoDiagnosticsAlternativeViewModel;
+
 namespace PlcHammer.Hmi.Blazor
 {
     public class Startup
     {
         public Startup(IConfiguration configuration)
         {
             Configuration = configuration;
+            MongoUri = Configuration["MongoDbSettings:MongoUri"];
+            DatabaseName = Configuration["MongoDbSettings:DatabaseName"];
+            CollectionName = Configuration["MongoDbSettings:CollectionName"];
         }
 
         public IConfiguration Configuration { get; }
 
+        //Uses Config from appsetings.Development.json, there the connection String etc. is configured
+        public static string MongoUri { get; private set; }
+        public static string DatabaseName { get; private set; }
+        public static string CollectionName { get; set; }
+
         public static StringWriter logMessages = new StringWriter();
 
         // This method gets called by the runtime. Use this method to add services to the container.
@@ -63,7 +77,7 @@ public void ConfigureServices(IServiceCollection services)
 
             services.AddTcoCoreExtensions();
 
-            if (true)/*Mongo database*/
+            if (false)/*Mongo database*/
             {
                 (userRepo, groupRepo) = SetUpMongoDatabase();
             }
@@ -84,16 +98,24 @@ public void ConfigureServices(IServiceCollection services)
                                         .WriteTo.Notepad()        // This will write logs to first instance of notepad program.
                                                                   // uncomment this to send logs over MQTT, to receive the data run MQTTTestClient from this solution.
                                                                   // .WriteTo.MQTT(new MQTTnet.Client.Options.MqttClientOptionsBuilder().WithTcpServer("broker.emqx.io").Build(), "fun_with_TcOpen_Hammer") 
-                                        .Enrich.WithProperty("user",SecurityManager.Manager.Principal.Identity.Name)
-                                        .Enrich.With(new Serilog.Enrichers.EnvironmentNameEnricher())
-                                        .Enrich.With(new Serilog.Enrichers.EnvironmentUserNameEnricher())
-                                        .Enrich.With(new Serilog.Enrichers.MachineNameEnricher())
+                                        .WriteTo.MongoDBBson(
+                                                        databaseUrl: $"{MongoUri}/{DatabaseName}",
+                                                        collectionName: $"{CollectionName}")
+                                        //            ).Enrich.WithProperty("user", SecurityManager.Manager.Principal.Identity.Name)
+                                        //.Enrich.With(new Serilog.Enrichers.EnvironmentNameEnricher())
+                                        //.Enrich.With(new Serilog.Enrichers.EnvironmentUserNameEnricher())
+                                        //.Enrich.With(new Serilog.Enrichers.MachineNameEnricher())
                                         .MinimumLevel.Verbose())) // Sets the logger configuration (default reports only to console).
                 .SetSecurity(SecurityManager.Manager.Service)
                 .SetEditValueChangeLogging(Entry.PlcHammer.Connector);
 
+            services.Configure<MongoDbSettings>(Configuration.GetSection("MongoDbSettings"));
+            services.AddTransient<IDataService, DataService>();
+            services.AddSingleton<DataBaseMaxEntryCleanupService>();
+            services.AddBlazorStrap();
         }
 
+
         // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
         public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
         {
@@ -126,7 +148,7 @@ public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
             });
 
             Entry.PlcHammer.Connector.BuildAndStart();
-            Entry.PlcHammer.TECH_MAIN._app._logger.StartLoggingMessages(TcoCore.eMessageCategory.Info);
+            Entry.PlcHammer.TECH_MAIN._app._logger.StartLoggingMessages(TcoCore.eMessageCategory.Debug);
         }
 
         private static void SetUpRepositories(IRepository<PlainStation001_ProductionData> processRecipiesRepository,
@@ -168,8 +190,8 @@ private static (IRepository<UserData> userRepo, IRepository<GroupData> groupRepo
 
         private static (IRepository<UserData> userRepo, IRepository<GroupData> groupRepo) SetUpMongoDatabase()
         {
-            var mongoUri = "mongodb://localhost:27017";
-            var databaseName = "Hammer";
+            var mongoUri = MongoUri;
+            var databaseName = DatabaseName;
 
             /*Data*/
             var processRecipiesRepository = new MongoDbRepository<PlainStation001_ProductionData>(new MongoDbRepositorySettings<PlainStation001_ProductionData>(mongoUri, databaseName, "ProcessSettings"));

src/TcOpen.Hammer/PlcHammer.Hmi.Blazor/appsettings.Development.json

@@ -1,10 +1,16 @@
 {
-  "DetailedErrors": true,
-  "Logging": {
-    "LogLevel": {
-      "Default": "Information",
-      "Microsoft": "Warning",
-      "Microsoft.Hosting.Lifetime": "Information"
+    "DetailedErrors": true,
+    "Logging": {
+        "LogLevel": {
+            "Default": "Information",
+            "Microsoft": "Warning",
+            "Microsoft.Hosting.Lifetime": "Information"
+        }
+    },
+    "MongoDbSettings": {
+        "MongoUri": "mongodb://localhost:27017",
+        "DatabaseName": "Hammer",
+        "CollectionName": "log"
     }
-  }
+
 }

src/TcOpen.Hammer/PlcHammerConnector/Entry.cs

@@ -5,8 +5,8 @@
 namespace PlcHammerConnector
 {
     public class Entry
-    {        
-        public static readonly string AmsId = Environment.GetEnvironmentVariable("Tc3Target");
+    {
+        public static readonly string AmsId = "5.107.180.64.1.1";
 
         public static PlcHammer.PlcHammerTwinController PlcHammer { get; }
             = new PlcHammer.PlcHammerTwinController(Tc3ConnectorAdapter.Create(AmsId, 851, true));

src/TcOpen.Hammer/docker-compose.yml

@@ -1,3 +1,4 @@
+
 version: "3.9"
 services:
   mongodb:
@@ -7,5 +8,26 @@ services:
       - HammerData:/data/db
     ports:
       - 27017:27017
+    healthcheck:
+      test: ["CMD", "mongo", "--eval", "db.adminCommand('ping')"]
+      interval: 30s
+      timeout: 10s
+      retries: 3
+
+  mongo-express:
+    image: mongo-express
+    container_name: mexpress
+    environment:
+      - ME_CONFIG_MONGODB_URL=mongodb://mongodb:27017/
+    links:
+      - mongodb
+    restart: unless-stopped
+    ports:
+      - "8081:8081"
+    depends_on:
+      mongodb:
+        condition: service_healthy
+
 volumes:
   HammerData:
+

src/TcoCore/src/TcOpen.Inxton.TcoCore.Blazor/TcOpen.Inxton.TcoCore.Blazor.csproj

@@ -19,16 +19,24 @@
   </ItemGroup>
 
   <ItemGroup>
+    <PackageReference Include="BlazorStrap" Version="5.1.102.51923" />
+    <PackageReference Include="BlazorStrap.V5" Version="5.1.102.51723" />
     <PackageReference Include="Inxton.Vortex.Presentation.Controls.Blazor-experimental" Version="2.0.0" />
-	<PackageReference Include="Blazm.Components" Version="1.0.5" />
-    <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="5.0.4" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="5.0.17" />
     <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="5.0.17" />
     <PackageReference Include="Microsoft.AspNetCore.SignalR.Core" Version="1.1.0" />
+    <PackageReference Include="MongoDB.Bson" Version="2.22.0" />
+    <PackageReference Include="MongoDB.Driver" Version="2.22.0" />
+    <PackageReference Include="Blazm.Components" Version="1.0.5" />
   </ItemGroup>
 
   <ItemGroup>
     <ProjectReference Include="..\..\..\TcOpen.Inxton\src\Abstractions\TcOpen.Inxton.Abstractions.csproj" />
     <ProjectReference Include="..\TcoCoreConnector\TcoCoreConnector.csproj" />
   </ItemGroup>
 
+  <ItemGroup>
+    <Folder Include="wwwroot\Icons\" />
+  </ItemGroup>
+
 </Project>

src/TcoCore/src/TcOpen.Inxton.TcoCore.Blazor/TcoDiagnostics/TcoDiagnosticsViewModel.cs

@@ -21,11 +21,13 @@ public TcoDiagnosticsViewModel()
             this.UpdateMessagesCommand = new RelayCommand(a => this.UpdateMessages(), (x) => !this.DiagnosticsRunning);
         }
 
-        public TcoDiagnosticsViewModel(IsTcoObject tcoObject)
-        {
-            _tcoObject = tcoObject;
-            this.UpdateMessagesCommand = new RelayCommand(a => this.UpdateMessages(), (x) => !this.DiagnosticsRunning);
-        }
+        //This is actually never called, so we could remove it
+        //public TcoDiagnosticsViewModel(IsTcoObject tcoObject)
+        //{
+        //    _tcoObject = tcoObject;
+        //    Console.WriteLine("tcoObject constructor called TcoDiagnosticsViewModel");
+        //    this.UpdateMessagesCommand = new RelayCommand(a => this.UpdateMessages(), (x) => !this.DiagnosticsRunning);
+        //}
         /// <summary>
         /// Gets the command that executes update of messages on demand.
         /// </summary>

src/TcoCore/src/TcOpen.Inxton.TcoCore.Blazor/TcoDiagnosticsAlternative/Configure/MongoDbSettings.cs

@@ -0,0 +1,20 @@
+using System;
+using System.Collections.Generic;
+using System.ComponentModel.DataAnnotations;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace TcOpen.Inxton.TcoCore.Blazor.TcoDiagnosticsAlternative.Configure
+{
+    public class MongoDbSettings
+    {
+        [Required]
+        public string MongoUri { get; set; }
+        [Required]
+        public string DatabaseName { get; set; }
+        [Required]
+        public string CollectionName { get; set; }
+    }
+
+}

src/TcoCore/src/TcOpen.Inxton.TcoCore.Blazor/TcoDiagnosticsAlternative/Helper/DateTimePicker/DateTimePickerComponent.razor

@@ -0,0 +1,84 @@
+<div class="d-flex">
+    @if (UseNative)
+    {
+        <input type="date" class="form-control w-auto d-inline" @bind-value="@Date" disabled="@IsDisabled" />
+        <TimePickerComponent @bind-SecondOfDay="SecondOfDay" UseNativeTimePicker="@UseNative" IsDisabled="IsDisabled" />
+    }
+    else
+    {
+        <input type="datetime-local" class="form-control w-auto d-inline" value="@(DateAndTime.ToString("yyyy-MM-ddTHH:mm"))" disabled="@IsDisabled"
+            @onchange="async (e) =>
+        {
+            var dateString = e.Value.ToString();
+            if(!string.IsNullOrEmpty(dateString))
+            {
+                DateAndTime = DateTime.Parse(dateString);
+            }
+            else
+            {
+                DateAndTime = new DateTime(2022, 01, 01, 12, 0, 0);
+            }
+            await NotifyChanged();
+        }"
+        />
+
+    }
+</div>
+
+@code {
+
+    [Parameter]
+    public DateTime DateAndTime
+    {
+        get; set;
+    }
+
+    [Parameter]
+    public EventCallback<DateTime> DateAndTimeChanged
+    {
+        get; set;
+    }
+
+    [Parameter]
+    public bool IsDisabled
+    {
+        get; set;
+    }
+
+    [Parameter]
+    public bool UseNative
+    {
+        get; set;
+    }
+
+    private DateTime Date
+    {
+        get
+        {
+            return DateAndTime.Date;
+        }
+        set
+        {
+            DateAndTime = value.AddSeconds(SecondOfDay);
+            _ = NotifyChanged();
+        }
+    }
+
+    private int SecondOfDay
+    {
+        get
+        {
+            return DateAndTime.Hour * 3600 + DateAndTime.Minute * 60;
+        }
+        set
+        {
+            DateAndTime = DateAndTime.Date.AddSeconds(value);
+            _ = NotifyChanged();
+        }
+    }
+
+    private Task NotifyChanged()
+    {
+        return DateAndTimeChanged.InvokeAsync(DateAndTime);
+    }
+}