Shady nagy/blazor enhance (#429)
* - Using cdnjs not nuget on bootstrap and signalr. - Bootstrap modal used for add, edit details and delete. * EditForm inside modal-content * Top close button action added * Removed unused using. * DeleteCookies moved inside AuthService * ApplicationCore removed from BlazorAdmin dependencies * SecureHttpClient removed * Logout from identity manager added * last thing to do in logout from admin is LogoutIdentityManager. * JSRuntime used in AuthService without pass to the functions * Link fixed when logout from MVC
This commit is contained in:
Shady Nagy
GitHub
@@ -5,82 +5,102 @@
|
||||
|
||||
@namespace BlazorAdmin.Pages.CatalogItemPage
|
||||
|
||||
<h2 class="esh-body-title">Create</h2>
|
||||
|
||||
<div>
|
||||
<EditForm Model="_item" OnValidSubmit="@CreateClick">
|
||||
<DataAnnotationsValidator />
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Name</label>
|
||||
<div class="col-md-3">
|
||||
<InputText class="form-control" @bind-Value="_item.Name" />
|
||||
<ValidationMessage For="(() => _item.Name)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Description</label>
|
||||
<div class="col-md-3">
|
||||
<InputText class="form-control" @bind-Value="_item.Description" />
|
||||
<ValidationMessage For="(() => _item.Description)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Brand</label>
|
||||
<div class="col-md-3">
|
||||
<InputSelect @bind-Value="_item.CatalogBrandId" class="form-control">
|
||||
@foreach (var brand in Brands)
|
||||
<div class="modal @_modalClass" tabindex="-1" role="dialog" style="display:@_modalDisplay">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<EditForm Model="_item" OnValidSubmit="@CreateClick">
|
||||
<DataAnnotationsValidator />
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">Create</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close" @onclick="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
@if (_item == null)
|
||||
{
|
||||
<option value="@brand.Id">@brand.Name</option>
|
||||
<Spinner></Spinner>
|
||||
}
|
||||
</InputSelect>
|
||||
<ValidationMessage For="(() => _item.CatalogBrandId)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Type</label>
|
||||
<div class="col-md-3">
|
||||
<InputSelect @bind-Value="_item.CatalogTypeId" class="form-control">
|
||||
@foreach (var type in Types)
|
||||
else
|
||||
{
|
||||
<option value="@type.Id">@type.Name</option>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Name</label>
|
||||
<div class="col-md-12">
|
||||
<InputText class="form-control" @bind-Value="_item.Name" />
|
||||
<ValidationMessage For="(() => _item.Name)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Description</label>
|
||||
<div class="col-md-12">
|
||||
<InputText class="form-control" @bind-Value="_item.Description" />
|
||||
<ValidationMessage For="(() => _item.Description)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Brand</label>
|
||||
<div class="col-md-12">
|
||||
<InputSelect @bind-Value="_item.CatalogBrandId" class="form-control">
|
||||
@foreach (var brand in Brands)
|
||||
{
|
||||
<option value="@brand.Id">@brand.Name</option>
|
||||
}
|
||||
</InputSelect>
|
||||
<ValidationMessage For="(() => _item.CatalogBrandId)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Type</label>
|
||||
<div class="col-md-12">
|
||||
<InputSelect @bind-Value="_item.CatalogTypeId" class="form-control">
|
||||
@foreach (var type in Types)
|
||||
{
|
||||
<option value="@type.Id">@type.Name</option>
|
||||
}
|
||||
</InputSelect>
|
||||
<ValidationMessage For="(() => _item.CatalogTypeId)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Price</label>
|
||||
<div class="col-md-12">
|
||||
<InputNumber @bind-Value="_item.Price" class="form-control" />
|
||||
<ValidationMessage For="(() => _item.Price)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Picture name</label>
|
||||
<div class="col-md-12 esh-form-information">
|
||||
Uploading images not allowed for this version.
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</InputSelect>
|
||||
<ValidationMessage For="(() => _item.CatalogTypeId)" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal" @onclick="Close">Cancel</button>
|
||||
<button type="submit" class="btn btn-primary">
|
||||
Create
|
||||
</button>
|
||||
</div>
|
||||
</EditForm>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Price</label>
|
||||
<div class="col-md-3">
|
||||
<InputNumber @bind-Value="_item.Price" class="form-control" />
|
||||
<ValidationMessage For="(() => _item.Price)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Picture name</label>
|
||||
<div class="col-md-4 esh-form-information">
|
||||
Uploading images not allowed for this version.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="col-md-offset-2 col-md-3 text-right esh-button-actions">
|
||||
<a href="" @onclick="@(() => OnCloseClick.InvokeAsync(null))" @onclick:preventDefault class="btn btn-secondary">
|
||||
Cancel
|
||||
</a>
|
||||
<button type="submit" class="btn esh-button btn-primary">
|
||||
Create
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</EditForm>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
@if (_showCreateModal)
|
||||
{
|
||||
<div class="modal-backdrop fade show"></div>
|
||||
}
|
||||
|
||||
@code {
|
||||
|
||||
[Parameter]
|
||||
@@ -91,21 +111,35 @@
|
||||
[Parameter]
|
||||
public EventCallback<string> OnCloseClick { get; set; }
|
||||
|
||||
private string _modalDisplay = "none;";
|
||||
private string _modalClass = "";
|
||||
private bool _showCreateModal = false;
|
||||
private readonly CreateCatalogItemRequest _item = new CreateCatalogItemRequest();
|
||||
|
||||
protected override async Task OnAfterRenderAsync(bool firstRender)
|
||||
private async Task CreateClick()
|
||||
{
|
||||
await new BlazorAdmin.Services.CatalogItemService.Create(Auth).HandleAsync(_item);
|
||||
await OnCloseClick.InvokeAsync(null);
|
||||
Close();
|
||||
}
|
||||
|
||||
public void Open()
|
||||
{
|
||||
Logger.LogInformation("Now loading... /Catalog/Create");
|
||||
|
||||
_item.CatalogTypeId = Types.First().Id;
|
||||
_item.CatalogBrandId = Brands.First().Id;
|
||||
|
||||
await base.OnAfterRenderAsync(firstRender);
|
||||
_modalDisplay = "block;";
|
||||
_modalClass = "Show";
|
||||
_showCreateModal = true;
|
||||
}
|
||||
|
||||
private async Task CreateClick()
|
||||
public void Close()
|
||||
{
|
||||
await new BlazorAdmin.Services.CatalogItemService.Create(Auth).HandleAsync(_item);
|
||||
await OnCloseClick.InvokeAsync(null);
|
||||
_modalDisplay = "none";
|
||||
_modalClass = "";
|
||||
_showCreateModal = false;
|
||||
OnCloseClick.InvokeAsync(null);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,66 +5,89 @@
|
||||
|
||||
@namespace BlazorAdmin.Pages.CatalogItemPage
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<img class="col-md-6 esh-picture" src="@($"https://localhost:44315/{_item.PictureUri}")">
|
||||
<div class="modal @_modalClass" tabindex="-1" role="dialog" style="display:@_modalDisplay">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">Delete @_item.Name</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close" @onclick="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
@if (_item == null)
|
||||
{
|
||||
<Spinner></Spinner>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<img class="col-md-6 esh-picture" src="@($"https://localhost:44315/{_item.PictureUri}")">
|
||||
|
||||
<dl class="col-md-6 dl-horizontal">
|
||||
<dt>
|
||||
Name
|
||||
</dt>
|
||||
<dl class="col-md-6 dl-horizontal">
|
||||
<dt>
|
||||
Name
|
||||
</dt>
|
||||
|
||||
<dd>
|
||||
@_item.Name
|
||||
</dd>
|
||||
<dd>
|
||||
@_item.Name
|
||||
</dd>
|
||||
|
||||
<dt>
|
||||
Description
|
||||
</dt>
|
||||
<dt>
|
||||
Description
|
||||
</dt>
|
||||
|
||||
<dd>
|
||||
@_item.Description
|
||||
</dd>
|
||||
<dd>
|
||||
@_item.Description
|
||||
</dd>
|
||||
|
||||
<dt>
|
||||
Brand
|
||||
</dt>
|
||||
<dt>
|
||||
Brand
|
||||
</dt>
|
||||
|
||||
<dd>
|
||||
@Services.CatalogBrandService.List.GetBrandName(Brands, _item.CatalogBrandId)
|
||||
</dd>
|
||||
<dd>
|
||||
@Services.CatalogBrandService.List.GetBrandName(Brands, _item.CatalogBrandId)
|
||||
</dd>
|
||||
|
||||
<dt>
|
||||
Type
|
||||
</dt>
|
||||
<dt>
|
||||
Type
|
||||
</dt>
|
||||
|
||||
<dd>
|
||||
@Services.CatalogTypeService.List.GetTypeName(Types, _item.CatalogTypeId)
|
||||
</dd>
|
||||
<dt>
|
||||
Price
|
||||
</dt>
|
||||
<dd>
|
||||
@Services.CatalogTypeService.List.GetTypeName(Types, _item.CatalogTypeId)
|
||||
</dd>
|
||||
<dt>
|
||||
Price
|
||||
</dt>
|
||||
|
||||
<dd>
|
||||
@_item.Price
|
||||
</dd>
|
||||
</dl>
|
||||
<dd>
|
||||
@_item.Price
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
}
|
||||
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal" @onclick="Close">Cancel</button>
|
||||
<button class="btn btn-danger" @onclick="() => DeleteClick(_item.Id)">
|
||||
Delete
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-actions no-color">
|
||||
<a href="" @onclick="@(() => OnCloseClick.InvokeAsync(null))" @onclick:preventDefault class="btn btn-secondary">
|
||||
Cancel
|
||||
</a>
|
||||
<button class="btn btn-danger" @onclick="DeleteClick">
|
||||
Delete
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (_showDeleteModal)
|
||||
{
|
||||
<div class="modal-backdrop fade show"></div>
|
||||
}
|
||||
|
||||
|
||||
@code {
|
||||
[Parameter]
|
||||
public int Id { get; set; }
|
||||
[Parameter]
|
||||
public IEnumerable<CatalogBrand> Brands { get; set; }
|
||||
[Parameter]
|
||||
@@ -73,23 +96,37 @@
|
||||
[Parameter]
|
||||
public EventCallback<string> OnCloseClick { get; set; }
|
||||
|
||||
private string _modalDisplay = "none;";
|
||||
private string _modalClass = "";
|
||||
private bool _showDeleteModal = false;
|
||||
private CatalogItem _item = new CatalogItem();
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
Logger.LogInformation("Now loading... /Catalog/Delete/{Id}", Id);
|
||||
|
||||
_item = await new GetById(Auth).HandleAsync(Id);
|
||||
|
||||
await base.OnInitializedAsync();
|
||||
}
|
||||
|
||||
private async Task DeleteClick()
|
||||
private async Task DeleteClick(int id)
|
||||
{
|
||||
// TODO: Add some kind of "are you sure" check before this
|
||||
|
||||
await new BlazorAdmin.Services.CatalogItemService.Delete(Auth).HandleAsync(Id);
|
||||
await new BlazorAdmin.Services.CatalogItemService.Delete(Auth).HandleAsync(id);
|
||||
|
||||
await OnCloseClick.InvokeAsync(null);
|
||||
Close();
|
||||
}
|
||||
|
||||
public async Task Open(int id)
|
||||
{
|
||||
Logger.LogInformation("Now loading... /Catalog/Delete/{Id}", id);
|
||||
|
||||
_item = await new GetById(Auth).HandleAsync(id);
|
||||
|
||||
_modalDisplay = "block;";
|
||||
_modalClass = "Show";
|
||||
_showDeleteModal = true;
|
||||
}
|
||||
|
||||
public void Close()
|
||||
{
|
||||
_modalDisplay = "none";
|
||||
_modalClass = "";
|
||||
_showDeleteModal = false;
|
||||
OnCloseClick.InvokeAsync(null);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,95 +5,127 @@
|
||||
|
||||
@namespace BlazorAdmin.Pages.CatalogItemPage
|
||||
|
||||
@if (_item == null)
|
||||
{
|
||||
<p><em>Loading...</em></p>
|
||||
}
|
||||
else
|
||||
{
|
||||
<h2 class="esh-body-title">Details</h2>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<img class="col-md-6 esh-picture" src="@($"https://localhost:44315/{_item.PictureUri}")">
|
||||
|
||||
<dl class="col-md-6 dl-horizontal">
|
||||
<dt>
|
||||
Name
|
||||
</dt>
|
||||
<div class="modal @_modalClass" tabindex="-1" role="dialog" style="display:@_modalDisplay">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">Details @_item.Name</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close" @onclick="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
|
||||
<dd>
|
||||
@_item.Name
|
||||
</dd>
|
||||
@if (_item == null)
|
||||
{
|
||||
<Spinner></Spinner>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<img class="col-md-6 esh-picture" src="@($"https://localhost:44315/{_item.PictureUri}")">
|
||||
|
||||
<dt>
|
||||
Description
|
||||
</dt>
|
||||
<dl class="col-md-6 dl-horizontal">
|
||||
<dt>
|
||||
Name
|
||||
</dt>
|
||||
|
||||
<dd>
|
||||
@_item.Description
|
||||
</dd>
|
||||
<dd>
|
||||
@_item.Name
|
||||
</dd>
|
||||
|
||||
<dt>
|
||||
Brand
|
||||
</dt>
|
||||
<dt>
|
||||
Description
|
||||
</dt>
|
||||
|
||||
<dd>
|
||||
@Services.CatalogBrandService.List.GetBrandName(Brands, _item.CatalogBrandId)
|
||||
</dd>
|
||||
<dd>
|
||||
@_item.Description
|
||||
</dd>
|
||||
|
||||
<dt>
|
||||
Type
|
||||
</dt>
|
||||
<dt>
|
||||
Brand
|
||||
</dt>
|
||||
|
||||
<dd>
|
||||
@Services.CatalogTypeService.List.GetTypeName(Types, _item.CatalogTypeId)
|
||||
</dd>
|
||||
<dt>
|
||||
Price
|
||||
</dt>
|
||||
<dd>
|
||||
@Services.CatalogBrandService.List.GetBrandName(Brands, _item.CatalogBrandId)
|
||||
</dd>
|
||||
|
||||
<dd>
|
||||
@_item.Price
|
||||
</dd>
|
||||
<dt>
|
||||
Type
|
||||
</dt>
|
||||
|
||||
</dl>
|
||||
<dd>
|
||||
@Services.CatalogTypeService.List.GetTypeName(Types, _item.CatalogTypeId)
|
||||
</dd>
|
||||
<dt>
|
||||
Price
|
||||
</dt>
|
||||
|
||||
<dd>
|
||||
@_item.Price
|
||||
</dd>
|
||||
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
}
|
||||
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal" @onclick="Close">Close</button>
|
||||
<button class="btn btn-danger" @onclick="EditClick">
|
||||
Edit
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-actions no-color">
|
||||
<a href="" @onclick="@(() => OnCloseClick.InvokeAsync(null))" @onclick:preventDefault class="btn btn-secondary">
|
||||
Cancel
|
||||
</a>
|
||||
<a href="" @onclick="@(() => OnEditClick.InvokeAsync(_item.Id))" @onclick:preventDefault class="btn btn-secondary">
|
||||
Edit
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (_showDetailsModal)
|
||||
{
|
||||
<div class="modal-backdrop fade show"></div>
|
||||
}
|
||||
|
||||
@code {
|
||||
[Parameter]
|
||||
public int Id { get; set; }
|
||||
[Parameter]
|
||||
public IEnumerable<CatalogBrand> Brands { get; set; }
|
||||
[Parameter]
|
||||
public IEnumerable<CatalogType> Types { get; set; }
|
||||
|
||||
[Parameter]
|
||||
public EventCallback<string> OnCloseClick { get; set; }
|
||||
[Parameter]
|
||||
public EventCallback<int> OnEditClick { get; set; }
|
||||
|
||||
private string _modalDisplay = "none;";
|
||||
private string _modalClass = "";
|
||||
private bool _showDetailsModal = false;
|
||||
private CatalogItem _item = new CatalogItem();
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
public void EditClick()
|
||||
{
|
||||
Logger.LogInformation("Now loading... /Catalog/Details/{Id}", Id);
|
||||
OnEditClick.InvokeAsync(_item.Id);
|
||||
Close();
|
||||
}
|
||||
|
||||
_item = await new GetById(Auth).HandleAsync(Id);
|
||||
StateHasChanged();
|
||||
public async Task Open(int id)
|
||||
{
|
||||
Logger.LogInformation("Now loading... /Catalog/Details/{Id}", id);
|
||||
|
||||
await base.OnInitializedAsync();
|
||||
_item = await new GetById(Auth).HandleAsync(id);
|
||||
|
||||
_modalDisplay = "block;";
|
||||
_modalClass = "Show";
|
||||
_showDetailsModal = true;
|
||||
}
|
||||
|
||||
public void Close()
|
||||
{
|
||||
_modalDisplay = "none";
|
||||
_modalClass = "";
|
||||
_showDetailsModal = false;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -5,85 +5,104 @@
|
||||
|
||||
@namespace BlazorAdmin.Pages.CatalogItemPage
|
||||
|
||||
<h2 class="esh-body-title">Edit</h2>
|
||||
|
||||
<div>
|
||||
<EditForm Model="_item" OnValidSubmit="@SaveClick">
|
||||
<DataAnnotationsValidator />
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Name</label>
|
||||
<div class="col-md-3">
|
||||
<InputText class="form-control" @bind-Value="_item.Name" />
|
||||
<ValidationMessage For="(() => _item.Name)" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal @_modalClass" tabindex="-1" role="dialog" style="display:@_modalDisplay">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<EditForm Model="_item" OnValidSubmit="@SaveClick">
|
||||
<DataAnnotationsValidator />
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">Edit @_item.Name</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close" @onclick="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Description</label>
|
||||
<div class="col-md-3">
|
||||
<InputText class="form-control" @bind-Value="_item.Description" />
|
||||
<ValidationMessage For="(() => _item.Description)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Brand</label>
|
||||
<div class="col-md-3">
|
||||
<InputSelect @bind-Value="_item.CatalogBrandId" class="form-control">
|
||||
@foreach (var brand in Brands)
|
||||
@if (_item == null)
|
||||
{
|
||||
<option value="@brand.Id">@brand.Name</option>
|
||||
<Spinner></Spinner>
|
||||
}
|
||||
</InputSelect>
|
||||
<ValidationMessage For="(() => _item.CatalogBrandId)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Type</label>
|
||||
<div class="col-md-3">
|
||||
<InputSelect @bind-Value="_item.CatalogTypeId" class="form-control">
|
||||
@foreach (var type in Types)
|
||||
else
|
||||
{
|
||||
<option value="@type.Id">@type.Name</option>
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Name</label>
|
||||
<div class="col-md-12">
|
||||
<InputText class="form-control" @bind-Value="_item.Name" />
|
||||
<ValidationMessage For="(() => _item.Name)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Description</label>
|
||||
<div class="col-md-12">
|
||||
<InputText class="form-control" @bind-Value="_item.Description" />
|
||||
<ValidationMessage For="(() => _item.Description)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Brand</label>
|
||||
<div class="col-md-12">
|
||||
<InputSelect @bind-Value="_item.CatalogBrandId" class="form-control">
|
||||
@foreach (var brand in Brands)
|
||||
{
|
||||
<option value="@brand.Id">@brand.Name</option>
|
||||
}
|
||||
</InputSelect>
|
||||
<ValidationMessage For="(() => _item.CatalogBrandId)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Type</label>
|
||||
<div class="col-md-12">
|
||||
<InputSelect @bind-Value="_item.CatalogTypeId" class="form-control">
|
||||
@foreach (var type in Types)
|
||||
{
|
||||
<option value="@type.Id">@type.Name</option>
|
||||
}
|
||||
</InputSelect>
|
||||
<ValidationMessage For="(() => _item.CatalogTypeId)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Price</label>
|
||||
<div class="col-md-12">
|
||||
<InputNumber @bind-Value="_item.Price" class="form-control" />
|
||||
<ValidationMessage For="(() => _item.Price)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Picture name</label>
|
||||
<div class="col-md-12 esh-form-information">
|
||||
Uploading images not allowed for this version.
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</InputSelect>
|
||||
<ValidationMessage For="(() => _item.CatalogTypeId)" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal" @onclick="Close">Cancel</button>
|
||||
<button type="submit" class="btn btn-primary">
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
</EditForm>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Price</label>
|
||||
<div class="col-md-3">
|
||||
<InputNumber @bind-Value="_item.Price" class="form-control" />
|
||||
<ValidationMessage For="(() => _item.Price)" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label col-md-2">Picture name</label>
|
||||
<div class="col-md-4 esh-form-information">
|
||||
Uploading images not allowed for this version.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="col-md-offset-2 col-md-3 text-right esh-button-actions">
|
||||
<a href="" @onclick="@(() => OnCloseClick.InvokeAsync(null))" @onclick:preventDefault class="btn btn-secondary">
|
||||
Cancel
|
||||
</a>
|
||||
<button type="submit" class="btn btn-primary">
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</EditForm>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
@if (_showEditModal)
|
||||
{
|
||||
<div class="modal-backdrop fade show"></div>
|
||||
}
|
||||
|
||||
@code {
|
||||
[Parameter]
|
||||
public int Id { get; set; }
|
||||
[Parameter]
|
||||
public IEnumerable<CatalogBrand> Brands { get; set; }
|
||||
[Parameter]
|
||||
@@ -92,19 +111,33 @@
|
||||
[Parameter]
|
||||
public EventCallback<string> OnCloseClick { get; set; }
|
||||
|
||||
private string _modalDisplay = "none;";
|
||||
private string _modalClass = "";
|
||||
private bool _showEditModal = false;
|
||||
private CatalogItem _item = new CatalogItem();
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
Logger.LogInformation("Now loading... /Catalog/Edit/{Id}", Id);
|
||||
|
||||
_item = await new GetById(Auth).HandleAsync(Id);
|
||||
|
||||
await base.OnInitializedAsync();
|
||||
}
|
||||
|
||||
private async Task SaveClick()
|
||||
{
|
||||
await new BlazorAdmin.Services.CatalogItemService.Edit(Auth).HandleAsync(_item);
|
||||
Close();
|
||||
}
|
||||
|
||||
public async Task Open(int id)
|
||||
{
|
||||
Logger.LogInformation("Now loading... /Catalog/Edit/{Id}", id);
|
||||
|
||||
_item = await new GetById(Auth).HandleAsync(id);
|
||||
|
||||
_modalDisplay = "block;";
|
||||
_modalClass = "Show";
|
||||
_showEditModal = true;
|
||||
}
|
||||
|
||||
public void Close()
|
||||
{
|
||||
_modalDisplay = "none";
|
||||
_modalClass = "";
|
||||
_showEditModal = false;
|
||||
OnCloseClick.InvokeAsync(null);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
@page "/admin"
|
||||
@attribute [Authorize(Roles = Microsoft.eShopWeb.ApplicationCore.Constants.AuthorizationConstants.Roles.ADMINISTRATORS)]
|
||||
@attribute [Authorize(Roles = Constants.Roles.ADMINISTRATORS)]
|
||||
@inject AuthService Auth
|
||||
@using global::Shared.Authorization
|
||||
@inherits BlazorAdmin.Helpers.BlazorComponent
|
||||
@namespace BlazorAdmin.Pages.CatalogItemPage
|
||||
|
||||
@@ -8,75 +9,59 @@
|
||||
|
||||
@if (catalogItems == null)
|
||||
{
|
||||
<p><em>Loading...</em></p>
|
||||
<Spinner></Spinner>
|
||||
}
|
||||
else
|
||||
{
|
||||
@if (!showCreate && !showDetails && !showEdit && !showDelete)
|
||||
{
|
||||
<p class="esh-link-wrapper">
|
||||
<button class="btn btn-primary" @onclick="@(() => CreateClick())">
|
||||
Create New
|
||||
</button>
|
||||
</p>
|
||||
|
||||
<table class="table table-striped table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Item Type</th>
|
||||
<th>Brand</th>
|
||||
<th>Id</th>
|
||||
<th>Name</th>
|
||||
<th>@nameof(CatalogItem.Description)</th>
|
||||
<th>@nameof(CatalogItem.Price)</th>
|
||||
<th>Actions</th>
|
||||
<p class="esh-link-wrapper">
|
||||
<button class="btn btn-primary" @onclick="@(CreateClick)">
|
||||
Create New
|
||||
</button>
|
||||
</p>
|
||||
|
||||
<table class="table table-striped table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Item Type</th>
|
||||
<th>Brand</th>
|
||||
<th>Id</th>
|
||||
<th>Name</th>
|
||||
<th>@nameof(CatalogItem.Description)</th>
|
||||
<th>@nameof(CatalogItem.Price)</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="cursor-pointer">
|
||||
@foreach (var item in catalogItems)
|
||||
{
|
||||
<tr @onclick="@(() => DetailsClick(item.Id))">
|
||||
<td>
|
||||
<img class="img-thumbnail" src="@($"https://localhost:44315/{item.PictureUri}")">
|
||||
</td>
|
||||
<td>@Services.CatalogTypeService.List.GetTypeName(catalogTypes, item.CatalogTypeId)</td>
|
||||
<td>@Services.CatalogBrandService.List.GetBrandName(catalogBrands, item.CatalogBrandId)</td>
|
||||
<td>@item.Id</td>
|
||||
<td>@item.Name</td>
|
||||
<td>@item.Description</td>
|
||||
<td>@item.Price</td>
|
||||
<td>
|
||||
<button @onclick="@(() => EditClick(item.Id))" @onclick:stopPropagation="true" class="btn btn-primary">
|
||||
Edit
|
||||
</button>
|
||||
|
||||
<button @onclick="@(() => DeleteClick(item.Id))" @onclick:stopPropagation="true" class="btn btn-primary">
|
||||
Delete
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="cursor-pointer">
|
||||
@foreach (var item in catalogItems)
|
||||
{
|
||||
<tr @onclick="@(() => DetailsClick(item.Id))">
|
||||
<td>
|
||||
<img class="img-thumbnail" src="@($"https://localhost:44315/{item.PictureUri}")">
|
||||
</td>
|
||||
<td>@Services.CatalogTypeService.List.GetTypeName(catalogTypes, item.CatalogTypeId)</td>
|
||||
<td>@Services.CatalogBrandService.List.GetBrandName(catalogBrands, item.CatalogBrandId)</td>
|
||||
<td>@item.Id</td>
|
||||
<td>@item.Name</td>
|
||||
<td>@item.Description</td>
|
||||
<td>@item.Price</td>
|
||||
<td>
|
||||
<a href="" @onclick="@(() => EditClick(item.Id))" @onclick:preventDefault class="btn btn-primary">
|
||||
Edit
|
||||
</a>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<a href="" @onclick="@(() => DeleteClick(item.Id))" @onclick:preventDefault class="btn btn-primary">
|
||||
Delete
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
@if (showDetails)
|
||||
{
|
||||
<Details Id="@selectedId" Brands="@catalogBrands" Types="@catalogTypes" OnCloseClick="CloseDetailsHandler" OnEditClick="EditDetailsHandler"></Details>
|
||||
}
|
||||
|
||||
@if (showEdit)
|
||||
{
|
||||
<Edit Id="@selectedId" Brands="@catalogBrands" Types="@catalogTypes" OnCloseClick="CloseEditHandler"></Edit>
|
||||
}
|
||||
|
||||
@if (showCreate)
|
||||
{
|
||||
<Create Brands="@catalogBrands" Types="@catalogTypes" OnCloseClick="CloseCreateHandler"></Create>
|
||||
}
|
||||
|
||||
@if (showDelete)
|
||||
{
|
||||
<Delete Id="@selectedId" Brands="@catalogBrands" Types="@catalogTypes" OnCloseClick="CloseDeleteHandler"></Delete>
|
||||
}
|
||||
<Details Brands="@catalogBrands" Types="@catalogTypes" @ref="DetailsComponent" OnEditClick="EditClick"></Details>
|
||||
<Edit Brands="@catalogBrands" Types="@catalogTypes" OnCloseClick="ReloadCatalogItems" @ref="EditComponent"></Edit>
|
||||
<Create Brands="@catalogBrands" Types="@catalogTypes" OnCloseClick="ReloadCatalogItems" @ref="CreateComponent"></Create>
|
||||
<Delete Brands="@catalogBrands" Types="@catalogTypes" OnCloseClick="ReloadCatalogItems" @ref="DeleteComponent"></Delete>
|
||||
}
|
||||
|
||||
@@ -12,11 +12,11 @@ namespace BlazorAdmin.Pages.CatalogItemPage
|
||||
private List<CatalogItem> catalogItems = new List<CatalogItem>();
|
||||
private List<CatalogType> catalogTypes = new List<CatalogType>();
|
||||
private List<CatalogBrand> catalogBrands = new List<CatalogBrand>();
|
||||
private bool showCreate = false;
|
||||
private bool showDetails = false;
|
||||
private bool showEdit = false;
|
||||
private bool showDelete = false;
|
||||
private int selectedId = 0;
|
||||
|
||||
private Edit EditComponent { get; set; }
|
||||
private Delete DeleteComponent { get; set; }
|
||||
private Details DetailsComponent { get; set; }
|
||||
private Create CreateComponent { get; set; }
|
||||
|
||||
protected override async Task OnAfterRenderAsync(bool firstRender)
|
||||
{
|
||||
@@ -32,58 +32,24 @@ namespace BlazorAdmin.Pages.CatalogItemPage
|
||||
await base.OnAfterRenderAsync(firstRender);
|
||||
}
|
||||
|
||||
private void DetailsClick(int id)
|
||||
private async void DetailsClick(int id)
|
||||
{
|
||||
selectedId = id;
|
||||
showDetails = true;
|
||||
await DetailsComponent.Open(id);
|
||||
}
|
||||
|
||||
private void CreateClick()
|
||||
{
|
||||
showCreate = true;
|
||||
CreateComponent.Open();
|
||||
}
|
||||
|
||||
private void EditClick(int id)
|
||||
private async Task EditClick(int id)
|
||||
{
|
||||
selectedId = id;
|
||||
showEdit = true;
|
||||
await EditComponent.Open(id);
|
||||
}
|
||||
|
||||
private void DeleteClick(int id)
|
||||
private async Task DeleteClick(int id)
|
||||
{
|
||||
selectedId = id;
|
||||
showDelete = true;
|
||||
}
|
||||
|
||||
private async Task CloseDetailsHandler(string action)
|
||||
{
|
||||
showDetails = false;
|
||||
await ReloadCatalogItems();
|
||||
}
|
||||
|
||||
private void EditDetailsHandler(int id)
|
||||
{
|
||||
showDetails = false;
|
||||
selectedId = id;
|
||||
showEdit = true;
|
||||
}
|
||||
|
||||
private async Task CloseEditHandler(string action)
|
||||
{
|
||||
showEdit = false;
|
||||
await ReloadCatalogItems();
|
||||
}
|
||||
|
||||
private async Task CloseDeleteHandler(string action)
|
||||
{
|
||||
showDelete = false;
|
||||
await ReloadCatalogItems();
|
||||
}
|
||||
|
||||
private async Task CloseCreateHandler(string action)
|
||||
{
|
||||
showCreate = false;
|
||||
await ReloadCatalogItems();
|
||||
await DeleteComponent.Open(id);
|
||||
}
|
||||
|
||||
private async Task ReloadCatalogItems()
|
||||
|
||||
@@ -1,27 +1,15 @@
|
||||
@page "/logout"
|
||||
@inject AuthService AuthService
|
||||
@inject NavigationManager NavigationManager
|
||||
@inject IJSRuntime JSRuntime
|
||||
@inherits BlazorAdmin.Helpers.BlazorComponent
|
||||
|
||||
|
||||
@code {
|
||||
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
await AuthService.Logout();
|
||||
await DeleteCookies();
|
||||
|
||||
CallRequestRefresh();
|
||||
await new Route(JSRuntime).RouteOutside("/Identity/Account/Login");
|
||||
}
|
||||
|
||||
private async Task DeleteCookies()
|
||||
{
|
||||
await new Cookies(JSRuntime).DeleteCookie("token");
|
||||
await new Cookies(JSRuntime).DeleteCookie("username");
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user