使用 EF 在 Blazor 中使用 SyncFusion 数据网格显示二维动态表

Question

如何展示&使用 EF 数据库连接在 Blazor 中编辑真正动态的 SyncFusion 数据网格表。棘手的部分是二维动态：具有 x 行数和 y 列数（来自其他表）。

在本例中，我有一个包含多个任务（行）和多个角色（列）的动态表，其中可以为每个任务/角色组合为每个角色分配不同的工作量（双数）。

所需的组件是动态 ExpandoObject，包括。能够更新的附加方法（因为字典本质上是只读的）、用于存储数组数据的数据库接口（据我所知 EF 没有提供）以及 razor 页面中的实现。

Answer 1

这就是我解决它的方法：

1. 一个动态对象，具有用于读取和读取的相应方法。更新：

public class EffortItem : DynamicObject
{
    public Dictionary EffortDict = new Dictionary();

    public override bool TryGetMember(GetMemberBinder binder, out object result)
    {
        string name = binder.Name;
        return EffortDict.TryGetValue(name, out result);
    }

    public override bool TrySetMember(SetMemberBinder binder, object value)
    {
        EffortDict[binder.Name] = value;
        return true;
    }

    public override IEnumerable GetDynamicMemberNames()
    {
        return this.EffortDict?.Keys;
    }

    public void Add(string Key, object Value)
    {
        EffortDict.Add(Key, Value);
    }

    public object Get(string Key)
    {
        var ret = (EffortDict.TryGetValue(Key, out object result)) ? result : null;
        return ret;
    }
}

2. 从数据库加载和存储动态对象数据的数据库接口方法：

//##################################
//### Converter for Efforts data
public async Task> GetDynEfforts()
{
    List dynList = new List();

    try
    {
        //### Get DB data
        var efforts = await this.Efforts.ToListAsync();
        var tasks = await this.PTask.ToListAsync();
        var roles = await this.Roles.ToListAsync();
        int ix = 1; double myEff = 0.0;
        string tName = "";

        if (efforts.Count == 0) return null;

        //### Create dynamic object
        dynList = Enumerable.Range(1, tasks.Count).Select((iy) =>
        {
            ix = 1;
            tName = tasks.Where(t => t.Id == iy).FirstOrDefault().NAME;
            EffortItem dynEff = new EffortItem();
            dynEff.Add("tID", iy);
            dynEff.Add("Task", tName);
            foreach (Role pRole in roles)
            {
                myEff = efforts.First(e => e.PTask == iy && e.Role == ix).eHrs;
                dynEff.Add(pRole.NAME, (double) myEff);
                ix++;
            }
            return dynEff;
        }).Cast().ToList();

        return dynList;

    } catch (Exception args)
    {
        MessagingCenter.Send(new AlertContent("Get Data Error", args.Message + "/" + args.InnerException, "fas fa-exclamation-triangle"), "AlertNotification");
        return null;
    }
}

public async Task SetDynEfforts(EffortItem updEfforts)
{
    //### Get DB data
    Efforts myEffort = null;
    var roles = Roles.ToList();
    double myEff = 0; int tID;

    //### Update db data from dynamic object
    try
    {
        tID = (int)updEfforts.Get("tID");
        foreach (Role pRole in roles)
        {
            var ok = double.TryParse(updEfforts.Get(pRole.NAME).ToString(), out myEff);
            if (!ok) myEff = 0;
            myEffort = Efforts.Where(e => (e.PTask == tID && e.Role == pRole.Id)).FirstOrDefault();

            if (myEffort != null)
            {
                myEffort.eHrs = myEff;
                this.Efforts.Update(myEffort);
            } else
            {
                myEffort = new Efforts
                {
                    PTask = tID,
                    Role = pRole.Id,
                    eHrs = myEff
                };
                this.Efforts.Add(myEffort);
            }

        }

        await this.SaveChangesAsync();
        return true;

    } catch
    {
        return false;
    }
}

3. Razor 页面以 2 个动态维度和 CRUD 处理事件动态显示表：

@if (dynList == null)
{
Loading...
}
else
{     
    <SfGrid DataSource="@dynList" AllowPaging="false" Toolbar="@ToolbarItems" AllowSorting="true" EnableAltRow="true" AllowGrouping="false" AllowTextWrap="true" Height="500">
        <GridEvents OnActionComplete="EffortsActionHandler" OnActionFailure="ActionFailureHandler" TValue="EffortItem"></GridEvents>
        <GridEditSettings AllowAdding="false" AllowDeleting="false" AllowEditing="true" AllowEditOnDblClick="true"></GridEditSettings>
        <GridColumns>
            @foreach (var colName in dynList[0].GetDynamicMemberNames())
            {
                @switch (colName) { 
                    case "Task":
                        <GridColumn Field="@colName" Width="250" IsPrimaryKey="true" AllowEditing="false" TextAlign="TextAlign.Left"></GridColumn>
                        break;
                    case "tID":
                        break;
                    default:
                    <GridColumn Field="@colName" Width="120" Format="N2" AllowEditing="true" TextAlign="TextAlign.Right">
                    </GridColumn>
                        break;
                    }
             }
        </GridColumns>
    </SfGrid>
    <p></p>
}

@code {
    List dynList { get; set; } = null;
    dynamic propEff = new ExpandoObject();
    List tasks;
    List roles;
    private List ToolbarItems = new List() { "Edit", "Update", "Cancel" };

    protected override async Task OnInitializedAsync()
    {
        tasks = await db.PTask.ToListAsync();
        roles = await db.Roles.ToListAsync();
        int ix = 1;
        string tName = ""; string rName = "";

        //### Get DB values into table object
        dynList = await db.GetDynEfforts();

        //### Create dummy entries if db is empty
        if (dynList == null)
        {
            //### Create new dynamic object
            dynList = new List();

            dynList = Enumerable.Range(1, tasks.Count).Select((iy) =>
            {
                ix = 1;
                tName = tasks.Where(t => t.Id == iy).FirstOrDefault().NAME;
                EffortItem dynEff = new EffortItem();
                dynEff.Add("tID", iy);
                dynEff.Add("Task", tName);
                foreach (Role pRole in roles)
                {
                    dynEff.Add(pRole.NAME, (double)0.0);
                    ix++;
                }
                return dynEff;

            }).Cast().ToList();

            //### Save to db as initial setup
            foreach (EffortItem dynEff in dynList) db.SetDynEfforts(dynEff);
        }
    }

    public async void EffortsActionHandler(ActionEventArgs args)
    {
        if (args.RequestType == Syncfusion.Blazor.Grids.Action.Save)
        {
            //if (!db.SetDynEfforts(args.Data).Result) throw new InvalidOperationException("Error during DB save operation");
            var ret = db.SetDynEfforts(args.Data);
        }
    }