Getting to making it work with modals

This commit is contained in:
Eugene ;) 2020-05-03 02:10:32 +02:00
parent 29cde263d3
commit 665357421a
9 changed files with 191 additions and 40 deletions

View File

@ -0,0 +1,11 @@
using System;
using System.Collections.Generic;
using System.Text;
namespace Seenginx.Models
{
public class NewFileForm
{
public string Name { get; set; }
}
}

View File

@ -12,7 +12,7 @@
</div> </div>
<div class="control has-icons-left"> <div class="control has-icons-left">
<div class="select is-small is-rounded"> <div class="select is-small is-rounded">
<select class="neoBtnSmall" @onchange="e => OnFilterClick(e.Value.ToString())"> <select class="neoInput" @onchange="e => OnFilterClick(e.Value.ToString())">
@foreach (var filter in Filters) @foreach (var filter in Filters)
{ {
<option value="@filter">@filter</option> <option value="@filter">@filter</option>
@ -107,3 +107,5 @@
</div> </div>
</div> </div>

View File

@ -1,4 +1,5 @@
using Microsoft.AspNetCore.Components; using Blazorise;
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web; using Microsoft.AspNetCore.Components.Web;
using Microsoft.JSInterop; using Microsoft.JSInterop;
using Seenginx.Models; using Seenginx.Models;
@ -24,12 +25,8 @@ namespace Seenginx.Components
[Parameter] [Parameter]
public Dictionary<string, string> FilterFolder { get; set; } = new Dictionary<string, string>(); public Dictionary<string, string> FilterFolder { get; set; } = new Dictionary<string, string>();
[Parameter]
public EventCallback AddFile { get; set; }
[Parameter] [Parameter]
public EventCallback<CFile> UpdateFile { get; set; } public EventCallback<CFile> UpdateFile { get; set; }
[Parameter]
public EventCallback DeleteFile { get; set; }
[Parameter] [Parameter]
public RenderFragment<CFile> Editor { get; set; } = null; public RenderFragment<CFile> Editor { get; set; } = null;
@ -160,17 +157,34 @@ namespace Seenginx.Components
var draftCode = await JsRuntime.InvokeAsync<string>("GetEditorCode"); var draftCode = await JsRuntime.InvokeAsync<string>("GetEditorCode");
SelectedFile.Body = draftCode; SelectedFile.Body = draftCode;
} }
[Parameter]
public EventCallback TestConfiguration { get; set; }
[Parameter]
public Result<string> TestResult { get; set; }
protected async Task OnTest(MouseEventArgs e) protected async Task OnTest(MouseEventArgs e)
{ {
await TestConfiguration.InvokeAsync(null);
} }
[Parameter]
public EventCallback AddFileModal { get; set; }
[Parameter]
public Result<ConfigFile> AddResult { get; set; }
protected async Task OnAddDialog() protected async Task OnAddDialog()
{ {
await AddFile.InvokeAsync(null); await AddFileModal.InvokeAsync(null);
} }
protected async Task OnDeleteDialog()
[Parameter]
public EventCallback DeleteFileModal { get; set; }
[Parameter]
public Result<bool> DeleteResult { get; set; }
protected async Task OnDeleteDialog(MouseEventArgs eventArgs)
{ {
await DeleteFile.InvokeAsync(null); await DeleteFileModal.InvokeAsync(eventArgs);
} }
} }
} }

View File

@ -0,0 +1,19 @@
@inherits GeneralNotificationModalBase
<Modal @ref="ModalReference">
<ModalBackdrop />
<ModalContent IsForm="false" IsCentered="true">
<ModalHeader>
<ModalTitle>
<span class="icon is-medium"><i class="mdi @NotificationSettings.TitleClass"></i></span>
<span>@NotificationSettings.Title</span>
</ModalTitle>
</ModalHeader>
<ModalBody>
<p>@NotificationSettings.Text</p>
</ModalBody>
<ModalFooter>
<Blazorise.Bulma.Button Color="@NotificationSettings.ButtonColor" Clicked="@HideGeneralNotificationModal">Ok</Blazorise.Bulma.Button>
</ModalFooter>
</ModalContent>
</Modal>

View File

@ -0,0 +1,44 @@
using Blazorise;
using Microsoft.AspNetCore.Components;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
namespace Seenginx.Components
{
public class GeneralNotificationModalBase : ComponentBase
{
[Parameter]
public Modal ModalReference { get; set; }
[Parameter]
public GeneralNotificationSettings NotificationSettings { get; set; }
public void ShowGeneralNotificationModal(string titleClass, string title, string text, Color color)
{
NotificationSettings.TitleClass = titleClass;
NotificationSettings.Title = title;
NotificationSettings.Text = text;
NotificationSettings.ButtonColor = color;
ModalReference.Show();
}
public void HideGeneralNotificationModal()
{
ModalReference.Hide();
NotificationSettings.TitleClass = null;
NotificationSettings.Title = null;
NotificationSettings.Text = null;
NotificationSettings.ButtonColor = Color.None;
}
}
public class GeneralNotificationSettings
{
public string TitleClass { get; set; }
public string Title { get; set; }
public string Text { get; set; }
public Color ButtonColor { get; set; }
}
}

View File

@ -1,26 +1,33 @@
@inherits NginxBase @inherits NginxBase
@page "/nginx" @page "/nginx"
<p>ciao</p>
<FilesWithEditor CFile="ConfigFile" Filters="Filters" Files="ConfigFiles" FilterFolder="FilterFolder" <FilesWithEditor CFile="ConfigFile" Filters="Filters" Files="ConfigFiles" FilterFolder="FilterFolder"
SelectedFile="SelectedFile" SelectedFileChanged="SelectedFileChanged" SelectedFile="SelectedFile" SelectedFileChanged="SelectedFileChanged"
AddFile="AddFile" DeleteFile="DeleteFile"> TestConfiguration="TestConfiguration" TestResult="TestResult"
DeleteFileModal="DeleteFile" DeleteResult="DeleteResult"
AddFileModal="ShowAddFileModal" AddResult="AddFileResult">
</FilesWithEditor> </FilesWithEditor>
<Modal @ref="ModalRef"> <Modal @ref="AddFileModal">
<ModalBackdrop /> <ModalBackdrop />
<ModalContent IsForm="true" IsCentered="true"> <ModalContent IsForm="true" IsCentered="true">
<ModalHeader> <ModalHeader>
<ModalTitle>Employee edit</ModalTitle> <ModalTitle>Add new file form</ModalTitle>
<CloseButton Clicked="@HideModal" /> <CloseButton Clicked="e => CloseModal(AddFileModal)"/>
</ModalHeader> </ModalHeader>
<ModalBody> <ModalBody>
<p>Area you sure about that?</p> <Blazorise.Bulma.Fields>
<Blazorise.Bulma.Field>
<Blazorise.Bulma.FieldLabel>File name</Blazorise.Bulma.FieldLabel>
<Blazorise.Bulma.FieldBody @bind-FileName="NewFileForm.Name"></Blazorise.Bulma.FieldBody>
<Blazorise.Bulma.FieldHelp>Service name which is going to be behing di config file</Blazorise.Bulma.FieldHelp>
</Blazorise.Bulma.Field>
</Blazorise.Bulma.Fields>
</ModalBody> </ModalBody>
<ModalFooter> <ModalFooter>
<Blazorise.Bulma.Button Color="Color.Secondary" Clicked="@HideModal">Close</Blazorise.Bulma.Button> <Blazorise.Bulma.Button Color="Color.Secondary" Clicked="e => CloseModal(AddFileModal)">Close</Blazorise.Bulma.Button>
<Blazorise.Bulma.Button Color="Color.Primary" Clicked="@HideModal">Save Changes</Blazorise.Bulma.Button> <Blazorise.Bulma.Button Color="Color.Primary" Clicked="AddFileAsync">Add</Blazorise.Bulma.Button>
</ModalFooter> </ModalFooter>
</ModalContent> </ModalContent>
</Modal> </Modal>
<GeneralNotificationModal ModalReference="GeneralNotificationModal"
NotificationSettings="GeneralNotificationSettings"></GeneralNotificationModal>

View File

@ -1,5 +1,7 @@
using Blazorise; using Blazorise;
using Microsoft.AspNetCore.Components; using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web;
using Seenginx.Components;
using Seenginx.Models; using Seenginx.Models;
using Seenginx.Services; using Seenginx.Services;
using System; using System;
@ -23,6 +25,8 @@ namespace Seenginx.Pages
public ConfigFile SelectedFile { get; set; } public ConfigFile SelectedFile { get; set; }
public List<string> Filters { get; set; } = new List<string>(); public List<string> Filters { get; set; } = new List<string>();
public List<int> FilteredOutFiles { get; set; } = new List<int>(); public List<int> FilteredOutFiles { get; set; } = new List<int>();
public Modal GeneralNotificationModal { get; set; } = new Modal();
public GeneralNotificationSettings GeneralNotificationSettings { get; set; } = null;
public Dictionary<string, string> FilterFolder { get; set; } = new Dictionary<string, string>(); public Dictionary<string, string> FilterFolder { get; set; } = new Dictionary<string, string>();
@ -43,33 +47,76 @@ namespace Seenginx.Pages
SelectedFile = configFile; SelectedFile = configFile;
} }
protected Modal ModalRef { get; set; }
protected void ShowModal() protected Modal AddFileModal { get; set; }
public Result<ConfigFile> AddFileResult { get; set; }
public async Task ShowAddFileModal()
{ {
ModalRef.Show(); AddFileModal.Show();
} }
public NewFileForm NewFileForm { get; set; } = new NewFileForm();
protected void HideModal() public async Task AddFileAsync()
{ {
ModalRef.Hide(); AddFileResult = await NginxService.AddFileAsync(NewFileForm);
} if (AddFileResult.AllOk)
ConfigFiles.Add(AddFileResult.Data);
public async Task AddFile() else
{ {
ShowModal(); GeneralNotificationSettings = new GeneralNotificationSettings
}
public async Task<Result<ConfigFile>> SaveDraftFileAsync() =>
await FileService.SaveUpdateDraftFileAsync(SelectedFile);
public async Task<Result<ConfigFile>> SaveFileAsync() =>
await FileService.SaveUpdateFileAsync(SelectedFile);
public Result<bool> DeleteFile(EventArgs eventArgs)
{ {
return FileService.DeleteFile(SelectedFile); ButtonColor = Color.Danger,
TitleClass = "mdi-error",
Title = "Failure",
Text = TestResult.ErrorMessage
};
GeneralNotificationModal.Show();
}
} }
public Result<ConfigFile> SaveUpdateDraftResult { get; set; }
public async Task SaveUpdateDraftFileAsync()
{
SaveUpdateDraftResult = await FileService.SaveUpdateDraftFileAsync(SelectedFile);
}
public Result<ConfigFile> SaveUpdateResult { get; set; }
public async Task SaveUpdateFileAsync()
{
SaveUpdateResult = await FileService.SaveUpdateFileAsync(SelectedFile);
}
public Result<string> TestResult { get; set; }
public async Task TestConfiguration()
{
TestResult = await NginxService.TestNginxConfigurations(SelectedFile);
if (TestResult.AllOk)
GeneralNotificationSettings = new GeneralNotificationSettings
{
ButtonColor = Color.Success,
TitleClass = "mdi-success",
Title = "Success",
Text = $"Test of config file '{SelectedFile.Name}' completed with success."
};
else
GeneralNotificationSettings = new GeneralNotificationSettings
{
ButtonColor = Color.Danger,
TitleClass = "mdi-error",
Title = "Failure",
Text = TestResult.ErrorMessage
};
GeneralNotificationModal.Show();
}
public Result<bool> DeleteResult { get; set; }
public void DeleteFile()
{
DeleteResult = FileService.DeleteFile(SelectedFile);
}
public void CloseModal(Modal modal)
{
modal.Hide();
}
} }
} }

View File

@ -7,6 +7,7 @@ namespace Seenginx.Services
public interface INginxService public interface INginxService
{ {
Task<IEnumerable<ConfigFile>> GetFilesAsync(); Task<IEnumerable<ConfigFile>> GetFilesAsync();
Task<Result<bool>> TestNginxConfigurations(); Task<Result<string>> TestNginxConfigurations(ConfigFile configFile);
Task<Result<ConfigFile>> AddFileAsync(NewFileForm newFileForm);
} }
} }

View File

@ -17,6 +17,12 @@ namespace Seenginx.Services
ConfigPaths = configPaths; ConfigPaths = configPaths;
} }
public async Task<Result<ConfigFile>> AddFileAsync(NewFileForm newFileForm)
{
var addResult = new Result<ConfigFile>();
addResult.Data.Name = newFileForm.Name;
return addResult;
}
public async Task<IEnumerable<ConfigFile>> GetFilesAsync() public async Task<IEnumerable<ConfigFile>> GetFilesAsync()
{ {
@ -82,10 +88,10 @@ namespace Seenginx.Services
return finalList; return finalList;
} }
public async Task<Result<bool>> TestNginxConfigurations() public async Task<Result<string>> TestNginxConfigurations(ConfigFile configFile)
{ {
var result = new Result<bool>(); var result = new Result<string>();
result.SetData(true); result.SetData("Uhu");
return result; return result;
} }
} }