RobotNet/RobotNet.WebApp/Maps/Components/Element/ElementDefaultProperty.razor
2025-10-15 15:15:53 +07:00

239 lines
12 KiB
Plaintext

@inject IDialogService Dialog
@inject ISnackbar Snackbar
@inject IHttpClientFactory HttpClientFactory
<div class="d-flex w-100 h-100 flex-column px-2">
<div class="d-flex flex-row justify-content-between w-100 mb-2">
<MudText Typo="Typo.h5" Class="d-flex align-items-center">Default Properties</MudText>
<div class="d-flex flex-row">
<MudTooltip RootClass="d-flex align-items-center" Text="Create" Placement="Placement.Bottom" Color="Color.Primary" Arrow="true">
<MudIconButton Icon="@Icons.Material.Filled.Add" Variant="Variant.Text" Color="Color.Primary" Size="Size.Small" OnClick="OpenElementProperty" Disabled="@(ElementModel is null || ElementProperties.Count >= 10)"></MudIconButton>
</MudTooltip>
<MudTooltip RootClass="d-flex align-items-center" Text="Edit" Placement="Placement.Bottom" Color="Color.Info" Arrow="true">
<MudIconButton Icon="@Icons.Material.Filled.Edit" Size="Size.Small" Color="Color.Info" Disabled="@(ElementModel is null || IsEdit || ElementProperties.Count == 0)" OnClick="(() => IsEdit = true)" />
</MudTooltip>
<MudTooltip RootClass="d-flex align-items-center" Text="Save" Placement="Placement.Bottom" Color="Color.Info" Arrow="true">
<MudIconButton Icon="@Icons.Material.Filled.Save" Variant="Variant.Text" Color="Color.Info" Size="Size.Small" Disabled="@(ElementModel is null || !IsEdit)" OnClick="Save" />
</MudTooltip>
</div>
</div>
<div class="d-flex w-100 flex-grow-1 overflow-x-hidden overflow-y-auto flex-column ps-2">
@foreach (var property in ElementProperties)
{
<div class="d-flex flex-row w-100 justify-content-between mb-1">
@if (property.Type == typeof(int).ToString())
{
if (int.TryParse(property.DefaultValue, out int value))
{
<MudNumericField T="int" Margin="Margin.Dense" Label="@property.Name" Value="value" Variant="Variant.Outlined" ReadOnly="@(!IsEdit)"
ValueChanged="((data) => DefaultIntValueChanged(property.Id, data))" />
}
}
else if (property.Type == typeof(double).ToString())
{
if (double.TryParse(property.DefaultValue, out double value))
{
<MudNumericField T="double" Margin="Margin.Dense" Label="@property.Name" Value="value" Variant="Variant.Outlined" Step="0.1" ReadOnly="@(!IsEdit)"
ValueChanged="((data) => DefaultDoubleValueChanged(property.Id, data))" />
}
}
else if (property.Type == typeof(bool).ToString())
{
if (bool.TryParse(property.DefaultValue, out bool value))
{
<MudCheckBox Class="m-0" Size="Size.Small" T="bool" LabelPlacement="Placement.Start" Label="@property.Name" Value="value" Color="Color.Success"
UncheckedColor="Color.Default" ReadOnly="@(!IsEdit)" ValueChanged="((data) => DefaultBooleanValueChanged(property.Id, data))" />
}
}
else if (property.Type == typeof(string).ToString())
{
<MudTextField T="string" Label="@property.Name" Value="@property.DefaultValue" Variant="Variant.Outlined" Margin="Margin.Dense" ReadOnly="@(!IsEdit)"
ValueChanged="((data) => property.DefaultValue = data)" />
}
<MudTooltip RootClass="d-flex align-items-center" Text="Delete" Placement="Placement.Bottom" Color="Color.Secondary" Arrow="true">
<MudIconButton Class="ms-4" Icon="@Icons.Material.Filled.Cancel" Size="Size.Small" Color="Color.Secondary"
OnClick="(async() => await DeleteProperty(property))" Disabled="@(!IsEdit)" />
</MudTooltip>
</div>
}
</div>
</div>
<MudDialog @bind-Visible="@CreatePropertyIsVisible" DefaultFocus="DefaultFocus.FirstChild">
<TitleContent>
<MudText Typo="Typo.h5">Create Element Property</MudText>
</TitleContent>
<DialogContent>
<div class="d-flex flex-column" style="max-height: 700px; overflow-y: auto">
<MudForm @ref="Form" @bind-IsValid="@createPropertyValidate">
<MudTextField Class="mt-2" ShrinkLabel
@bind-Value="ElementPropertyCreateModel.Name" T="string"
Label="Name" Required="true" RequiredError="Name is required!"
Counter="16" Variant="Variant.Outlined"
Validation="@(new Func<string, IEnumerable<string>>(MapEditorHelper.NameValidation))" />
<MudSelect Class="mb-4" T="string" Variant="Variant.Outlined" Label="Type" Required="true" RequiredError="Type is required!"
@bind-Value="@ElementPropertyCreateModel.Type" @bind-Value:after="Form.Validate">
@foreach (var type in ElementProperty.PropertyTypes)
{
<MudSelectItem Value="@type.ToString()">@ElementProperty.GetPropertyTypeName(type)</MudSelectItem>
}
</MudSelect>
<MudTextField T="string" @bind-Value="@ElementPropertyCreateModel.DefaultValue" Variant="Variant.Outlined" Label="Default Value" ShrinkLabel
Validation="@(new Func<string, IEnumerable<string>>(DefaultValidation))" />
<MudCheckBox Size="Size.Small" T="bool" LabelPlacement="Placement.Start" Label="Monitor ReadOnly" @bind-value="ElementPropertyCreateModel.ReadOnly" Color="Color.Success"
UncheckedColor="Color.Default" />
</MudForm>
</div>
</DialogContent>
<DialogActions>
<MudButton Color="Color.Default" Variant="Variant.Filled" OnClick="(() => CreatePropertyIsVisible = false)">Cancel</MudButton>
<MudButton Color="Color.Primary" Variant="Variant.Filled" Disabled="@(!createPropertyValidate)" OnClick="CreateProperty">Create</MudButton>
</DialogActions>
</MudDialog>
@code {
private bool CreatePropertyIsVisible;
private ElementProperty ElementPropertyCreateModel = new();
private ElementModelDto? ElementModel = null;
private List<ElementProperty> ElementProperties = [];
private bool createPropertyValidate;
private MudForm Form = default!;
private bool IsEdit = false;
private HttpClient Http = default!;
protected override async Task OnAfterRenderAsync(bool firstRender)
{
await base.OnAfterRenderAsync(firstRender);
if (!firstRender) return;
Http = HttpClientFactory.CreateClient("MapManagerAPI");
}
private void OpenElementProperty()
{
ElementPropertyCreateModel.Name = "";
ElementPropertyCreateModel.Type = ElementProperty.PropertyTypes[0].ToString();
ElementPropertyCreateModel.DefaultValue = "";
ElementPropertyCreateModel.ReadOnly = false;
CreatePropertyIsVisible = true;
StateHasChanged();
}
public void SetElementModel(ElementModelDto? model)
{
ElementModel = model;
ElementProperties.Clear();
if (model is not null && !string.IsNullOrEmpty(model.Content))
{
var properties = JsonSerializer.Deserialize<List<ElementProperty>>(model.Content, JsonOptionExtends.Read);
if (properties is not null) ElementProperties = [.. properties];
}
StateHasChanged();
}
private async Task CreateProperty()
{
if (string.IsNullOrEmpty(ElementPropertyCreateModel.Name))
{
Snackbar.Add("Name không được để trống.", Severity.Warning);
return;
}
if (ElementProperties.Any(p => p.Name == ElementPropertyCreateModel.Name))
{
Snackbar.Add($"Tên Property {ElementPropertyCreateModel.Name} đã tồn tại, vui lòng chon tên khác!", Severity.Warning);
return;
}
ElementProperties.Add(new ElementProperty()
{
Id = Guid.NewGuid(),
Name = ElementPropertyCreateModel.Name,
Type = ElementPropertyCreateModel.Type,
DefaultValue = ElementPropertyCreateModel.DefaultValue,
ReadOnly = ElementPropertyCreateModel.ReadOnly,
});
await Save();
CreatePropertyIsVisible = false;
StateHasChanged();
}
public IEnumerable<string> DefaultValidation(string value)
{
if (ElementPropertyCreateModel.Type == typeof(int).ToString())
{
if (!int.TryParse(value, out _)) yield return "Giá trị mặc định không hợp lệ";
}
else if (ElementPropertyCreateModel.Type == typeof(double).ToString())
{
if (!double.TryParse(value, out _)) yield return "Giá trị mặc định không hợp lệ";
}
else if (ElementPropertyCreateModel.Type == typeof(bool).ToString())
{
if (!bool.TryParse(value, out _)) yield return "Giá trị mặc định không hợp lệ";
}
}
private void DefaultIntValueChanged(Guid id, int value)
{
var property = ElementProperties.FirstOrDefault(p => p.Id == id);
if (property is null) return;
property.DefaultValue = value.ToString();
}
private void DefaultDoubleValueChanged(Guid id, double value)
{
var property = ElementProperties.FirstOrDefault(p => p.Id == id);
if (property is null) return;
property.DefaultValue = value.ToString();
}
private void DefaultBooleanValueChanged(Guid id, bool value)
{
var property = ElementProperties.FirstOrDefault(p => p.Id == id);
if (property is null) return;
property.DefaultValue = value.ToString();
}
private async Task DeleteProperty(ElementProperty property)
{
var parameters = new DialogParameters<ConfirmDialog>
{
{ x => x.Content, $"Bạn có chắc chắn muốn xóa property {property.Name} đi không?" },
{ x => x.ConfirmText, "Delete" },
{ x => x.Color, Color.Secondary }
};
var ConfirmDelete = await Dialog.ShowAsync<ConfirmDialog>("Xoá Property", parameters);
var result = await ConfirmDelete.Result;
if (result is not null && result.Data is not null && bool.TryParse(result.Data.ToString(), out bool data) && data)
{
var prope = ElementProperties.Remove(property);
}
StateHasChanged();
}
private async Task Save()
{
if (ElementModel is null) return;
var result = await (await Http.PutAsJsonAsync($"api/ElementModels", new ElementModelUpdateModel()
{
Id = ElementModel.Id,
Name = ElementModel.Name,
MapId = ElementModel.MapId,
Width = ElementModel.Width,
Height = ElementModel.Height,
Content = JsonSerializer.Serialize(ElementProperties, JsonOptionExtends.Write),
})).Content.ReadFromJsonAsync<MessageResult<ElementModelDto>>();
if (result == null) Snackbar.Add("Lỗi giao tiếp với hệ thống", Severity.Error);
else if (!result.IsSuccess) Snackbar.Add(result.Message, Severity.Error);
else Snackbar.Add("Cập nhật thành công", Severity.Success);
IsEdit = false;
StateHasChanged();
}
}