Introduction of the template FilesWithEditor

This commit is contained in:
Eugene ;) 2020-04-16 00:49:34 +02:00
parent 0af8f20db1
commit c584733ab1
23 changed files with 31565 additions and 48 deletions

View File

@ -0,0 +1,3 @@
@inherits FileItemBase

View File

@ -0,0 +1,16 @@
using Microsoft.AspNetCore.Components;
using Seenginx.Models;
using System;
using System.Collections.Generic;
using System.Text;
namespace Seenginx.Components
{
public class FileItemBase : ComponentBase
{
[Parameter]
public ConfigFile File { get; set; }
}
}

View File

@ -0,0 +1,65 @@
@typeparam CFile
<div class="tile is-ancestor">
<div class="tile is-parent is-vertical is-3">
<div class="content">
<p>
@foreach (var filter in Filters)
{
<span class="tag is-light">@filter</span>
}
</p>
</div>
<div class="content">
<div class="field">
<div class="control">
<InputText Value="SearchInput" ValueChanged="OnSearchChanged" class="input is-primary" type="text" placeholder="Search..." />
</div>
</div>
</div>
<div class="content">
<aside class="menu">
<ul class="menu-list">
@foreach (var file in Files)
{
<li>
<FileItem File="file" @onclick="OnFileClick(file)"></FileItem>
</li>
}
<li><a>Dashboard</a></li>
<li><a>Customers</a></li>
</ul>
</aside>
</div>
<div class="content">
<div class="buttons has-addons">
<button class="button is-primary">
<span class="icon is-small">
<i class="mdi mdi-plus-box-outline"></i>
</span>
Add
</button>
<button class="button is-warning">
<span class="icon is-small">
<i class="mdi mdi-pencil-box-outline"></i>
</span>
Update
</button>
<button class="button is-danger">
<span class="icon is-small">
<i class="mdi mdi-minus-box-outline"></i>
</span>
Delete
</button>
</div>
</div>
</div>
<div class="tile is-parent is-vertical is-9">
@Editor
</div>
</div>

View File

@ -0,0 +1,87 @@
using Microsoft.AspNetCore.Components;
using Seenginx.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace Seenginx.Components
{
public partial class FilesWithEditor<CFile> : ComponentBase
where CFile : ConfigFile
{
[Parameter]
public List<CFile> Files { get; set; } = new List<CFile>();
[Parameter]
public List<string> Filters { get; set; } = new List<string>();
[Parameter]
public List<int> FilteredOutFiles { get; set; } = new List<int>();
[Parameter]
public EventCallback<string> ApplyFilter { get; set; }
[Parameter]
public RenderFragment<CFile> Editor { get; set; }
[Parameter]
public RenderFragment<CFile> CreateDialog { get; set; }
[Parameter]
public RenderFragment<CFile> UpdateDialog { get; set; }
[Parameter]
public RenderFragment<CFile> DeleteDialog { get; set; }
protected bool IsAnyFileSelected => SelectedFile != default;
private CFile SelectedFile { get; set; }
protected string SearchInput { get; set; }
protected async Task OnDeselectClick()
{
SelectedFile = null;
//Clean on the right
}
protected async Task OnFilterClick(EventArgs e, string filter)
{
await ApplyFilter.InvokeAsync(filter);
for (int index = 0; index < Files.Count; index++)
if (FilteredOutFiles.Contains(index))
Files[index].Hide();
else
Files[index].Unhide();
}
protected async Task OnSearchChanged()
{
if (string.IsNullOrEmpty(SearchInput))
Files.ForEach(f => f.Hide());
else
Files.ForEach(f =>
{
if (f.Name.ToLower().Contains(SearchInput.ToLower()))
f.Unhide();
else
f.Hide();
});
}
protected async Task OnFileClick(CFile file)
{
SelectedFile = file;
}
protected async Task OnCreateFile()
{
}
protected async Task OnUpdateDialog(CFile file)
{
}
protected async Task OnDeleteDialog(CFile file)
{
}
}
}

View File

@ -14,7 +14,7 @@
<ItemGroup>
<Folder Include="wwwroot\" />
<ProjectReference Include="..\Seenginx.Models\Seenginx.Models.csproj" />
</ItemGroup>
</Project>

View File

@ -1,3 +1,2 @@
@using Microsoft.AspNetCore.Components.Web
@*@using Radzen*@
@*@using Radzen.Blazor*@
@using Microsoft.AspNetCore.Components.Forms

10855
Seenginx.Components/wwwroot/css/bulma.css vendored Normal file

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

View File

@ -16,5 +16,9 @@ namespace Seenginx.Models
public string[] Owners { get; set; }
public string Permissions { get; set; }
public bool CanBeDeleted { get; set; } = true;
public string IsVisible { get; set; } = string.Empty;
public void Hide() { IsVisible = "hide"; }
public void Unhide() { IsVisible = string.Empty; }
}
}

View File

@ -7,7 +7,7 @@ Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Seenginx", "Seenginx\Seengi
EndProject
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Seenginx.Models", "Seenginx.Models\Seenginx.Models.csproj", "{DF2CB075-2A33-4EAE-BB1C-7DEDA0D84A9D}"
EndProject
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Seenginx.Components", "Seenginx.Components\Seenginx.Components.csproj", "{EB02BCC6-1B40-44FB-9493-ACAD2E0AB963}"
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Seenginx.Components", "Seenginx.Components\Seenginx.Components.csproj", "{EB02BCC6-1B40-44FB-9493-ACAD2E0AB963}"
EndProject
Global
GlobalSection(SolutionConfigurationPlatforms) = preSolution

View File

@ -2,21 +2,11 @@
@page "/nginx"
<RadzenTabs>
<Tabs>
<RadzenTabsItem Text="Configuration">
<div class="pure-g">
<div class="pure-g">
<div class="pure-u-1-5">
<p>Configuration Files</p>
<RadzenListBox AllowFiltering="true"
FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive"
@bind-Value="InputSearch"
Data="@ConfigFiles"
TextProperty="Name"
ValueProperty="Name"
Change="@(args => Change(args, "ListBox with filtering"))"
Style="margin-bottom: 20px; height:200px;" />
heh
</div>
<div class="pure-u-4-5">
@ -24,11 +14,5 @@
Hello
</h1>
</div>
</div>
</div>
</RadzenTabsItem>
<RadzenTabsItem Text="Logs">
</RadzenTabsItem>
</Tabs>
</RadzenTabs>

View File

@ -0,0 +1,18 @@
@inherits NginxLogsBase
@page "/nginx/logs"
<div class="pure-g">
<div class="pure-u-1-5">
<p>Configuration Files</p>
heh
</div>
<div class="pure-u-4-5">
<h1>
Hello
</h1>
</div>
</div>

View File

@ -0,0 +1,37 @@
using Microsoft.AspNetCore.Components;
using Radzen;
using Radzen.Blazor;
using Seenginx.Models;
using Seenginx.Services;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.InteropServices;
using System.Threading.Tasks;
namespace Seenginx.Pages
{
public class NginxLogsBase : ComponentBase
{
[Inject]
public INginxService NginxService { get; set; }
public string InputSearch { get; set; }
public List<ConfigFile> ConfigFiles { get; set; } = new List<ConfigFile>();
protected override async Task OnInitializedAsync()
{
ConfigFiles.AddRange(await NginxService.GetFilesAsync());
await base.OnInitializedAsync();
}
protected void Change(object value, string name)
{
var str = value is IEnumerable<object> ? string.Join(", ", (IEnumerable<object>)value) : value;
StateHasChanged();
}
}
}

View File

@ -8,12 +8,13 @@
</NavLink>
</p>
<p class="menu-label flexCenter">
<span class="mdi mdi-18px"><img src="https://img.icons8.com/color/18/000000/nginx.png"></span>
<span class="mdi mdi-18px"><img src="https://img.icons8.com/color/20/000000/nginx.png"></span>
<span class="petiteCaps">&nbsp; NginX</span>
</p>
<ul class="menu-list">
<li>
<NavLink href="/nginx" class="petiteCaps"
@key="@ActiveNav.Keys.ElementAt(0)"
ActiveClass="@ActiveNav.GetValueOrDefault("nginx")"
@onclick="@(e => SelectMenuItem("nginx"))">
<span class="mdi mdi-file-cog-outline"></span>
@ -22,6 +23,7 @@
</li>
<li>
<NavLink href="/nginx/logs" class="petiteCaps"
@key="@ActiveNav.Keys.ElementAt(1)"
ActiveClass="@ActiveNav.GetValueOrDefault("nginx/logs")"
@onclick="@(e => SelectMenuItem("nginx/logs"))">
<span class="mdi mdi-information-outline"></span>
@ -30,12 +32,13 @@
</li>
</ul>
<p class="menu-label flexCenter">
<span class="mdi mdi-18px"><img src="https://img.icons8.com/color/18/000000/service.png"></span>
<span class="mdi mdi-18px"><img src="https://img.icons8.com/color/20/000000/service.png"></span>
<span class="petiteCaps">&nbsp; SystemD</span>
</p>
<ul class="menu-list">
<li>
<NavLink href="/systemd" class="petiteCaps"
@key="@ActiveNav.Keys.ElementAt(2)"
ActiveClass="@ActiveNav.GetValueOrDefault("systemd")"
@onclick="@(e => SelectMenuItem("systemd"))">
<span class="mdi mdi-file-cog-outline"></span>
@ -44,6 +47,7 @@
</li>
<li>
<NavLink href="/systemd/logs" class="petiteCaps"
@key="@ActiveNav.Keys.ElementAt(3)"
ActiveClass="@ActiveNav.GetValueOrDefault("systemd/logs")"
@onclick="@(e => SelectMenuItem("systemd/logs"))">
<span class="mdi mdi-information-outline"></span>
@ -52,12 +56,13 @@
</li>
</ul>
<p class="menu-label flexCenter">
<span class="mdi mdi-18px"><img src="https://img.icons8.com/color/18/000000/event-log.png"></span>
<span class="mdi mdi-18px"><img src="https://img.icons8.com/color/20/000000/event-log.png"></span>
<span class="petiteCaps">&nbsp; Dmesg</span>
</p>
<ul class="menu-list">
<li>
<NavLink href="/dmesg" class="petiteCaps"
@key="@ActiveNav.Keys.ElementAt(4)"
ActiveClass="@ActiveNav.GetValueOrDefault("dmesg")"
@onclick="@(e => SelectMenuItem("dmesg"))">
<span class="mdi mdi-information-outline"></span>

View File

@ -10,11 +10,6 @@ namespace Seenginx.Shared
{
protected Dictionary<string, string> ActiveNav { get; set; }
public bool CollapsePanel { get; set; } = false;
[Parameter]
public string MenuActiveClass { get; set; }
[Parameter]
public EventCallback<string> MenuActiveClassChanged { get; set; }
protected async override Task OnInitializedAsync()
{
@ -36,14 +31,5 @@ namespace Seenginx.Shared
ActiveNav[menuItem] = "is-active";
}
protected async Task ToggleMenu()
{
CollapsePanel = !CollapsePanel;
MenuActiveClass = CollapsePanel ? "active" : null;
await MenuActiveClassChanged.InvokeAsync(MenuActiveClass);
StateHasChanged();
}
}
}