@page "/rates"

<h3>Rate 评分</h3>

<h4>评分组件</h4>

<Block Title="基本用法" Introduction="<code>Rate</code> 组件通过 1 - 5 颗星表示数值等级，后台可以通过 <code>bind-Value</code> 对数值进行双向绑定通过 <code>Rate</code> 组件更改其值，鼠标滑动更改值，点击星星时确认其值">
    <div class="form-inline">
        <div class="row">
            <div class="col-12">
                <Rate Value="@BindValue" ValueChanged="@OnValueChanged" />
            </div>
        </div>
    </div>
    <Logger @ref="Trace" class="mt-3" />
</Block>

<Block Title="禁用" Introduction="通过设置 <code>IsDisable</code> 属性值禁用组件">
    <div class="form-inline">
        <div class="row">
            <div class="form-group col-6">
                <Rate Value="@BindValue1" IsDisable="IsDisable" />
            </div>
            <div class="form-group col-6">
                <Switch @bind-Value="IsDisable" OnText="禁用" OnColor="Color.Danger" OffText="启用" OffColor="@Color.Success" />
            </div>
        </div>
    </div>
</Block>

<AttributeTable Items="@GetAttributes()" />

<EventTable Items="@GetEvents()" />

// 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.Shared.Common;
using BootstrapBlazor.Shared.Pages.Components;
using System.Collections.Generic;

namespace BootstrapBlazor.Shared.Pages
{
    /// <summary>
    /// 
    /// </summary>
    public sealed partial class Rates
    {
        private int BindValue { get; set; } = 3;

        private int BindValue1 { get; set; } = 2;

        private bool IsDisable { get; set; }

        /// <summary>
        /// 
        /// </summary>
        private Logger? Trace { get; set; }

        private void OnValueChanged(int val)
        {
            BindValue = val;
            Trace?.Log($"评星: {val}");
        }

        /// <summary>
        /// 获得事件方法
        /// </summary>
        /// <returns></returns>
        private static IEnumerable<EventItem> GetEvents() => new EventItem[]
        {
            new EventItem()
            {
                Name = "ValueChanged",
                Description="值改变时回调委托",
                Type ="EventCallback<int>"
            }
        };

        /// <summary>
        /// 获得属性方法
        /// </summary>
        /// <returns></returns>
        private static IEnumerable<AttributeItem> GetAttributes() => new AttributeItem[]
        {
            // TODO: 移动到数据库中
            new AttributeItem() {
                Name = "Value",
                Description = "组件值",
                Type = "int",
                ValueList = " — ",
                DefaultValue = " — "
            },
            new AttributeItem()
            {
                Name = "IsDisabled",
                Description = "是否禁用 默认为 fasle",
                Type = "bool",
                ValueList = "true|false",
                DefaultValue = "false"
            }
        };
    }
}