用户编辑和角色编辑几乎一模一样，这里先直接贴代码。

@page "/user"
@using BlazorLearn.Entity
@using Furion.DataEncryption

<Table TItem="UserEntity" IsBordered="true" ShowAddButton="true" ShowToolbar="true"
       ShowExtendButtons="true" ShowEditButtonCallback="entity => entity.Id != 1" ShowDeleteButtonCallback="entity => entity.Id != 1"
       OnQueryAsync="OnQueryAsync" OnSaveAsync="OnSaveAsync">
    <TableColumns>
        <TableColumn @bind-Field="@context.UserName"></TableColumn>
        <TableColumn @bind-Field="@context.Name"></TableColumn>
        <TableColumn @bind-Field="@context.RoleId" Lookup="Roles"></TableColumn>
    </TableColumns>
    <RowButtonTemplate>
        <TableCellButton Color="Color.Success" Icon="fa fa-edit" Text="重置密码" OnClickWithoutRender="() => ShowModal(context)"></TableCellButton>
    </RowButtonTemplate>
</Table>

<Modal @ref="PasswordModal">
    <ModalDialog Title="重置密码">
        <BodyTemplate>
            <BootstrapInput @bind-Value="SelectedUser.Password" DisplayText="请输入新密码"></BootstrapInput>
        </BodyTemplate>
        <FooterTemplate>
            <Button OnClick="ResetPassword">重置密码</Button>
        </FooterTemplate>
    </ModalDialog>
</Modal>

@code {
    
    private List<SelectedItem>? Roles { get; set; }
    
    private Modal? PasswordModal { get; set; }
    
    private UserEntity? SelectedUser { get; set; }

    protected override void OnInitialized()
    {
        base.OnInitialized();
        SelectedUser = new UserEntity();
        Roles = RoleEntity.Select.ToList().Select(x => new SelectedItem(x.Id.ToString(), x.Name!)).ToList();
    }

    private Task<QueryData<UserEntity>> OnQueryAsync(QueryPageOptions arg)
    {
        var users = UserEntity.Select.Count(out var count)
            .Page(arg.PageIndex, arg.PageItems).ToList();
        return Task.FromResult(new QueryData<UserEntity>()
        {
            Items = users,
            TotalCount = (int)count
        });
    }

    private Task<bool> OnSaveAsync(UserEntity arg1, ItemChangedType arg2)
    {
        if (arg2 == ItemChangedType.Add)
        {
            arg1.Password = MD5Encryption.Encrypt(arg1.UserName);
        }
        arg1.Save();
        return Task.FromResult<bool>(true);
    }

    private void ResetPassword()
    {
        SelectedUser.Password = MD5Encryption.Encrypt(SelectedUser.Password);
        SelectedUser?.Save();
        PasswordModal?.Toggle();
    }

    private Task ShowModal(UserEntity userEntity)
    {
        SelectedUser = userEntity;
        SelectedUser.Password = "";
        PasswordModal?.Toggle();
        StateHasChanged();
        return Task.CompletedTask;
    }

}

这里解释几个地方。

一个是Lookup，这个东西还是很好用的，可以直接使用SelectedItem把Id类的东西直接转成名字，同时修改新增等等功能也会一同使用。

这里我们直接在初始化的时候拿出所有的角色转换成SelectedItem

private List<SelectedItem>? Roles { get; set; }

Roles = RoleEntity.Select.ToList().Select(x => new SelectedItem(x.Id.ToString(), x.Name!)).ToList();

然后我们只需要将User绑定的RoleId列的Lookup指向Roles就行了。

<TableColumn @bind-Field="@context.RoleId" Lookup="Roles"></TableColumn>

另一个就是修改密码的时候我偷懒了，不应该直接把整个UserEntity拿过来去掉密码字段。这里应该单独拿出密码来处理完再Update进去更好，不过例子嘛，这样写也行。

第三个就是我这里在添加新用户的时候默认使用了用户名相同的密码，这个要根据安全需求来，并且第一次是否需要改密码之类的可以都在这里处理。

标签：Blazor,Server,,编辑,用户名,java,JavaScript 来源：

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。