如何在项目中添加新功能按钮 - Known开源企业级开发框架

框架默认提供增删改查导等常用的按钮定义，如果要在前端项目中添加新功能按钮，例如：入库，那么按如下步骤进行

在项目的前后端共用项目资源文件actions.txt中定义

//配置字段分别为：ID、名称、图标、颜色样式、按钮位置(
按钮编码 | 按钮名称 | 按钮图标 | 按钮样式(primary,danger) | 按钮位置(Toolbar,Action)
StoreIn | 入库 | import | primary | Toolbar

运行项目，进入模块管理，在页面设置里即可在【工具条】或【操作列】中选择该操作按钮
在页面代码中添加该按钮的方法，注意方法名与按钮ID一致，工具条方法不带参数，操作列方法要带一个实体类参数
点击页面新增、编辑按钮，默认弹出在线配置的表单，对于自定义按钮，根据业务需求有调转页面、弹出表单、弹出页面等

[Route("/bds/tests")]
public class TestList : BaseTablePage<TbTest>
{
    //弹出表单对话框有两种方式，如下面两个方法所示

    //若是工具条，则无参数
    public void StoreIn()
    {
        //通过C#创建表单，如果表单字段较少，建议用此种方式简单，不需要再添加YourForm.razor文件
        var info = new TbTest();
        var form = new FormModel<TbTest>(this)
        {
            Title = "入库", //对话框标题
            ConfirmText = "确定要入库？", //点击确定按钮弹出的确认提示
            Data = info, //表单绑定的数据
            OnSave = Service.StoreInOrdersAsync, //确定按钮保存方法
            OnSaved = async d => await RefreshAsync() //保存后关闭对话框刷新页面
        };
        //下面是两行一列布局（一行多列，可以在AddColumn后面继续添加）
        form.AddRow().AddColumn(c => c.Field1, c => { /*在此设置字段属性*/ })
                     .AddColumn(c => c.Field2);
        form.AddRow().AddColumn(c => c.Note);
        UI.ShowForm(form); //弹窗显示
    }

    //若是操作列，则有参数
    public void StoreIn(TbTest row)
    {
        //通过YourForm.razor创建，对于复杂表单建议用razor创建一个新表单组件
        var dialog = new DialogModel
        {
            Title = "入库", //对话框标题
            Content = b => b.Component<YourForm>().Set(c => c.Model, row).Build(), //对话框内容
            OnOk = () => Task.CompletedTask, //确定按钮事件
            OnClose = () => Task.CompletedTask //关闭按钮事件
        };
        UI.ShowDialog(dialog); //弹窗显示
    }
}

下面是YourForm.razor的示例，由于AntForm、AntRow等组件是扩展AntDesign的，如果_Imports.razor中没有引用命名空间，那么需要在里面添加引用@using Known.AntBlazor.Components

@inherits BaseForm<TbTest>

<AntForm Form="Model">
    <AntRow>
        <DataItem Span="12" Label="字段1" Required>
            <AntInput @bind-Value="@context.Field1" />
        </DataItem>
        <DataItem Span="12" Label="字段2" Required>
            <AntInput @bind-Value="@context.Field2" />
        </DataItem>
    </AntRow>
    <AntRow>
        <DataItem Span="24" Label="备注">
            <AntTextArea @bind-Value="@context.Note" />
        </DataItem>
    </AntRow>
</AntForm>