BzDialog / BzPopup
دیالوگ و پاپ آپ
دیالوگ با reference، سرویس مرکزی confirm/alert و پاپ آپ.
دکمهفرم و اینپوتگروه اینپوتگروه دکمهانتخاب تاریختکمیل خودکارکارتنمایشلودینگدیالوگاعلانپیام عملیاتمنو کشوییکانتکس منوصفحه بندیلایت باکسدرختدیتاگریدنمودارتب و آکاردیوننویگیشن بارسایدبارتایم لاینویزارداسلایدرآپلودرادیتور متنتقویمابزار ایرانی
کامپوننتی پیدا نشد.
دیالوگ با reference
با ref به دیالوگ دسترسی می گیریم و Show() را صدا می زنیم. نکته مهم: حتما bind-Open را هم قرار بده تا وضعیت باز بودن در والد نگه داشته شود.
@using BzCore.Components.Dialog
@using BzCore.Components.Input
@using BzCore.Components.Button
@using BzCore.Dialog
@using BzCore.Enums
<BzButton Text="باز کردن دیالوگ" StartIcon="fa-solid fa-window-maximize"
OnClick="@(() => _dlg.Show())" />
@* bind-Open is required: after a click the parent re-renders and would otherwise
push Open=false back into the dialog and close it again. *@
<BzDialog @ref="_dlg" @bind-Open="_dlgOpen"
Title="ویرایش کاربر" Icon="fa-solid fa-user-pen"
Size="BzDialogSize.Medium" Buttons="_buttons"
OnClose="@(r => _result = r)">
<ChildContent>
<BzInput TValue="string" @bind-Value="_editName" Label="نام کاربر" Clearable />
</ChildContent>
</BzDialog>
@if (_result is not null)
{
<p>نتیجه: @(_result.Confirmed ? $"تایید ({_editName})" : "لغو")</p>
}
@code {
private BzDialog _dlg = default!;
private bool _dlgOpen;
private BzDialogResult? _result;
private string _editName = "";
private List<BzDialogButton> _buttons = new()
{
new BzDialogButton { Text = "انصراف", IsCancel = true, Variant = BzButtonVariant.Text },
new BzDialogButton { Text = "ذخیره", Color = BzColor.Primary,
OnClick = async () => await Task.Delay(600) },
};
}کنترل کامل با bind-Open
بدون reference — فقط یک bool. ساده ترین و مطمئن ترین روش.
@using BzCore.Components.Dialog
@using BzCore.Components.Button
@using BzCore.Enums
<BzButton Text="باز کردن" Variant="BzButtonVariant.Outlined"
OnClick="@(() => _open = true)" />
<BzDialog @bind-Open="_open" Title="سلام" Icon="fa-solid fa-hand" Size="BzDialogSize.Small">
<ChildContent>
<p>این دیالوگ فقط با یک متغیر bool کنترل میشه.</p>
</ChildContent>
</BzDialog>
@code {
private bool _open;
}سرویس مرکزی confirm / alert
بدون نوشتن هیچ مارکاپی، از هر جای برنامه دیالوگ بگیرید. کافی است یک بار BzDialogHost را در لی اوت قرار بده.
@using BzCore.Components.Button
@using BzCore.Components.Dialog
@using BzCore.Dialog
@using BzCore.Enums
@inject IBzDialogService DialogSvc
<BzButton Text="Confirm" Color="BzColor.Danger" StartIcon="fa-solid fa-trash" OnClick="ConfirmDelete" />
<BzButton Text="Alert" Variant="BzButtonVariant.Outlined" OnClick="ShowAlert" />
@if (_deleted) { <p>رکورد حذف شد</p> }
@* Place this once — usually in MainLayout, not on every page. *@
<BzDialogHost />
@code {
private bool _deleted;
private async Task ConfirmDelete()
{
var ok = await DialogSvc.ConfirmAsync("حذف رکورد", "از حذف این رکورد مطمئن هستید؟");
if (ok) _deleted = true;
}
private async Task ShowAlert() =>
await DialogSvc.AlertAsync("اطلاع", "این یک پیام اطلاع رسانی است.");
}
@*
Program.cs — the service is registered by AddBlazify():
builder.Services.AddBlazify();
*@BzPopup
پاپ آور سبک برای منوها — با Trigger و ChildContent.
@using BzCore.Components.Popup
@using BzCore.Components.Button
@using BzCore.Enums
<BzPopup Placement="BzPopupPlacement.Bottom" Width="220px">
<Trigger>
<BzButton Text="منوی کاربر" EndIcon="fa-solid fa-chevron-down" Variant="BzButtonVariant.Soft" />
</Trigger>
<ChildContent>
<BzButton Variant="BzButtonVariant.Text" FullWidth StartIcon="fa-solid fa-user" Text="پروفایل" />
<BzButton Variant="BzButtonVariant.Text" FullWidth StartIcon="fa-solid fa-gear" Text="تنظیمات" />
<BzButton Variant="BzButtonVariant.Text" FullWidth StartIcon="fa-solid fa-right-from-bracket"
Text="خروج" Color="BzColor.Danger" />
</ChildContent>
</BzPopup>اندازه های دیالوگ
همه اندازه ها یک کد دارند و فقط Size فرق میکنه.
| Size | کاربرد |
|---|---|
BzDialogSize.Small | تایید کوتاه، پیام ساده |
BzDialogSize.Medium | فرم های معمولی (پیش فرض) |
BzDialogSize.Large | جدول، محتوای طولانی |
@using BzCore.Components.Dialog
@using BzCore.Components.Button
@using BzCore.Enums
<BzButton Text="Small" Variant="BzButtonVariant.Soft" OnClick="@(() => Open(BzDialogSize.Small))" />
<BzButton Text="Medium" Variant="BzButtonVariant.Soft" OnClick="@(() => Open(BzDialogSize.Medium))" />
<BzButton Text="Large" Variant="BzButtonVariant.Soft" OnClick="@(() => Open(BzDialogSize.Large))" />
<BzDialog @bind-Open="_open" Size="_size" Title="@_size.ToString()" Icon="fa-solid fa-ruler-combined">
<ChildContent>
<p>Size = <b>@_size</b></p>
</ChildContent>
</BzDialog>
@code {
private bool _open;
private BzDialogSize _size = BzDialogSize.Medium;
private void Open(BzDialogSize size)
{
_size = size;
_open = true;
}
}