@page "/editdialogs"

<h3>EditDialog 编辑弹窗</h3>

<h4>通过绑定数据模型自动呈现编辑弹窗</h4>

<p><code>EditDialog</code> 组件是 <code>Dialog</code> 组件的扩展，适用于数据弹出窗编辑。</p>

<Tips>
	<p>通过调用注入服务 <code>DialogService</code> 的 <code>ShowEditDialog</code> 方法直接弹出编辑对话框，大大减少代码量。<code>EditDialogOption</code> 配置类继承 <code>DialogOption</code>，更多参数设置请点击 <a href="dialogs" target="_blank">[传送门]</a></p>
</Tips>

<Block Title="基础用法" Introduction="通过绑定 <code>TModel</code> 数据模型，自动生成模型各个字段的可编辑表单">
	<Button Text="编辑弹窗(左对齐)" OnClickWithoutRender="@ShowDialog" />
	<Button Text="编辑弹窗(右对齐)" OnClickWithoutRender="@ShowAlignDialog" />
	<BlockLogger @ref="Trace" class="mt-3" />
</Block>

<Block Title="设置绑定模型部分属性不显示" Introduction="通过设置 <code>IEditorItem</code> 实例的 <code>Editable=false</code>, 实现编辑弹窗不显示此属性">
	<Button Text="弹窗" OnClickWithoutRender="@ShowEditDialog" />
</Block>

<AttributeTable Items="@GetAttributes()" Title="EditDialogOption 属性" />

// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
// Website: https://www.blazor.zone or https://argozhang.github.io/

using BootstrapBlazor.Components;
using BootstrapBlazor.Shared.Common;
using BootstrapBlazor.Shared.Pages.Components;
using Microsoft.AspNetCore.Components;
using Microsoft.Extensions.Localization;
using System.Collections.Generic;
using System.Diagnostics.CodeAnalysis;
using System.Linq;
using System.Threading.Tasks;

namespace BootstrapBlazor.Shared.Pages
{
    /// <summary>
    /// 
    /// </summary>
    public sealed partial class EditDialogs
    {
        private Foo Model { get; set; } = new Foo()
        {
            Name = "Name 1234",
            Address = "Address 1234"
        };

        [Inject]
        [NotNull]
        private DialogService? DialogService { get; set; }

        [Inject]
        [NotNull]
        private IStringLocalizer<Foo>? Localizer { get; set; }

        [NotNull]
        private BlockLogger? Trace { get; set; }

        private async Task ShowDialog()
        {
            var items = EditorItem<Foo>.GenerateEditorItems();
            var item = items.First(i => i.GetFieldName() == nameof(Foo.Hobby));
            item.Data = Foo.GenerateHobbys(Localizer);

            var option = new EditDialogOption<Foo>()
            {
                Title = "编辑对话框",
                Model = Model,
                Items = items,
                ItemsPerRow = 2,
                RowType = RowType.Inline,
                OnCloseAsync = () =>
                {
                    Trace.Log("关闭按钮被点击");
                    return Task.CompletedTask;
                },
                OnSaveAsync = context =>
                {
                    Trace.Log("保存按钮被点击");
                    return Task.FromResult(true);
                }
            };

            await DialogService.ShowEditDialog(option);
        }

        private async Task ShowAlignDialog()
        {
            var items = EditorItem<Foo>.GenerateEditorItems();
            var item = items.First(i => i.GetFieldName() == nameof(Foo.Hobby));
            item.Data = Foo.GenerateHobbys(Localizer);

            var option = new EditDialogOption<Foo>()
            {
                Title = "编辑对话框",
                Model = Model,
                Items = items,
                ItemsPerRow = 2,
                RowType = RowType.Inline,
                LabelAlign = Alignment.Right,
                OnCloseAsync = () =>
                {
                    Trace.Log("关闭按钮被点击");
                    return Task.CompletedTask;
                },
                OnSaveAsync = context =>
                {
                    Trace.Log("保存按钮被点击");
                    return Task.FromResult(true);
                }
            };

            await DialogService.ShowEditDialog(option);
        }

        private async Task ShowEditDialog()
        {
            var items = EditorItem<Foo>.GenerateEditorItems();
            var item = items.First(i => i.GetFieldName() == nameof(Foo.Hobby));
            item.Data = Foo.GenerateHobbys(Localizer);

            // 设置 地址与数量 不可编辑
            item = items.First(i => i.GetFieldName() == nameof(Foo.Address));
            item.Editable = false;
            item = items.First(i => i.GetFieldName() == nameof(Foo.Count));
            item.Editable = false;

            var option = new EditDialogOption<Foo>()
            {
                Title = "编辑对话框",
                Model = Model,
                Items = items,
                ItemsPerRow = 2,
                RowType = RowType.Inline,
                OnCloseAsync = () =>
                {
                    Trace.Log("关闭按钮被点击");
                    return Task.CompletedTask;
                },
                OnSaveAsync = context =>
                {
                    Trace.Log("保存按钮被点击");
                    return Task.FromResult(true);
                }
            };

            await DialogService.ShowEditDialog(option);
        }

        /// <summary>
        /// 获得属性方法
        /// </summary>
        /// <returns></returns>
        private static IEnumerable<AttributeItem> GetAttributes() => new AttributeItem[]
        {
            // TODO: 移动到数据库中
            new AttributeItem() {
                Name = "ShowLabel",
                Description = "是否显示标签",
                Type = "bool",
                ValueList = "true|false",
                DefaultValue = "true"
            },
            new AttributeItem() {
                Name = "Model",
                Description = "泛型参数用于呈现 UI",
                Type = "TModel",
                ValueList = " — ",
                DefaultValue = " — "
            },
            new AttributeItem() {
                Name = "Items",
                Description = "编辑项集合",
                Type = "IEnumerable<IEditorItem>",
                ValueList = " — ",
                DefaultValue = " — "
            },
            new AttributeItem() {
                Name = "DialogBodyTemplate",
                Description = "EditDialog Body 模板",
                Type = "RenderFragment<TModel>",
                ValueList = " — ",
                DefaultValue = " — "
            },
            new AttributeItem() {
                Name = "CloseButtonText",
                Description = "关闭按钮文本",
                Type = "string",
                ValueList = " — ",
                DefaultValue = "关闭"
            },
            new AttributeItem() {
                Name = "SaveButtonText",
                Description = "保存按钮文本",
                Type = "string",
                ValueList = " — ",
                DefaultValue = "保存"
            },
            new AttributeItem() {
                Name = "OnSaveAsync",
                Description = "保存回调委托",
                Type = "Func<Task>",
                ValueList = " — ",
                DefaultValue = " — "
            },
            new AttributeItem() {
                Name = "ItemsPerRow",
                Description = "每行显示组件数量",
                Type = "int?",
                ValueList = " — ",
                DefaultValue = " — "
            },
            new AttributeItem() {
                Name = "RowType",
                Description = "设置组件布局方式",
                Type = "RowType",
                ValueList = "Row|Inline",
                DefaultValue = "Row"
            },
            new AttributeItem() {
                Name = "LabelAlign",
                Description = "Inline 布局模式下标签对齐方式",
                Type = "Alignment",
                ValueList = "None|Left|Center|Right",
                DefaultValue = "None"
            }
        };
    }
}