数值框 (Number)

数值类型输入组件。

概述

基于HTML5标签实现

代码演示

1.默认示例

数量1：

数量2：

个

namespace WebSite.Docus.Inputs.Numbers;

class Number1 : BaseComponent
{
    protected override void BuildRenderTree(RenderTreeBuilder builder)
    {
        builder.Field<Number>("数量1：", "Number1").Build();
        builder.Field<Number>("数量2：", "Number2").Value("10").Set(f => f.Unit, "个").Build();
    }
}

2.控制示例

可见

可用

只读

数量：

个

namespace WebSite.Docus.Inputs.Numbers;

class Number2 : BaseComponent
{
    private Number? number;

    protected override void BuildRenderTree(RenderTreeBuilder builder)
    {
        builder.Component<FieldControl>()
               .Set(c => c.OnVisibleChanged, OnVisibleChanged)
               .Set(c => c.OnEnabledChanged, OnEnabledChanged)
               .Set(c => c.OnReadOnlyChanged, OnReadOnlyChanged)
               .Set(c => c.SetValue, SetValue)
               .Set(c => c.GetValue, GetValue)
               .Build();

        builder.Field<Number>("数量：", "Number").Set(f => f.Unit, "个").Build(value => number = value);
    }

    private void OnVisibleChanged(bool value) => number?.SetVisible(value);
    private void OnEnabledChanged(bool value) => number?.SetEnabled(value);
    private void OnReadOnlyChanged(bool value) => number?.SetReadOnly(value);
    private void SetValue() => number?.SetValue(100);
    private string? GetValue() => number?.Value;
}

3.QPA联动示例

数量：

个

单价：

元

金额：

元

namespace WebSite.Docus.Inputs.Numbers;

class Number3 : Form
{
    protected override void BuildFields(RenderTreeBuilder builder)
    {
        builder.Field<Number>("数量：", "Qty")
               .Set(f => f.Unit, "个")
               .Set(f => f.OnValueChanged, OnQPAChanged)
               .Build();
        builder.Field<Number>("单价：", "Price")
               .Set(f => f.Unit, "元")
               .Set(f => f.OnValueChanged, OnQPAChanged)
               .Build();
        builder.Field<Number>("金额：", "Amount")
               .Set(f => f.Unit, "元")
               .Set(f => f.OnValueChanged, OnQPAChanged)
               .Build();
    }

    protected override void BuildButtons(RenderTreeBuilder builder) { }

    private static void OnQPAChanged(FieldContext context)
    {
        var qty = context.Fields["Qty"].ValueAs<decimal>();
        if (context.FieldId == "Qty" || context.FieldId == "Price")
        {
            var price = context.Fields["Price"].ValueAs<decimal>();
            if (qty * price > 0)
                context.Fields["Amount"].SetValue(Utils.Round(qty * price, 2));
        }
        else if (context.FieldId == "Amount")
        {
            var amount = context.Fields["Amount"].ValueAs<decimal>();
            context.Fields["Price"].SetValue(qty == 0 ? 0 : Utils.Round(amount / qty, 4));
        }
    }
}