ABP+AdminLTE+Bootstrap Table權限管理系統第十一節--Bootstrap Table用戶管理列表以及Module Zero之用戶管理

 

返回總目錄:ABP+AdminLTE+Bootstrap Table權限管理系統一期

 

 

   用戶實體

      用戶實體表明應用的一個用戶，它派生自AbpUser類，以下所示：

     

public class User : AbpUser<Tenant, User>
{
    //add your own user properties here
}

         這個類是在安裝模塊零時建立的。用戶存儲在數據庫的AbpUsers表中。您能夠將自定義屬性添加到User類（併爲更改建立數據庫遷移）。

      AbpUser類定義了一些基本屬性。一些屬性是：

• UserName：用戶的登陸名，對於一個租戶來講應該是惟一的。
• EmailAddress：用戶的郵箱地址。對於租戶來講應該是惟一的。
• Password：用戶的哈希密碼。
• IsActive：若是用戶能夠登陸到該應用，那麼此值爲true。
• Name和Surname：用戶的名和姓。

還有一些屬性，如角色， 權限，租戶，設置， IsEmailConfirmed等。檢查AbpUser類以獲取更多信息。

AbpUser類是從FullAuditedEntity繼承的。這意味着它具備建立，修改和刪除審計屬性。這也是 軟刪除。因此，當咱們刪除一個用戶時，它不會從數據庫中刪除，只是標記爲已刪除。

AbpUser類實現了 IMayHaveTenant 過濾器，以便在多租戶應用程序中正常工做。

最後，用戶的Id被定義爲long。

   

        用戶管理器

UserManager是 爲用戶執行域邏輯的服務：

public  class UserManager：AbpUserManager <Tenant，Role，User> 
{ // ... 
}
    

         您能夠注入並使用UserManager建立，刪除，更新用戶，授予權限，更改用戶角色等等。你能夠在這裏添加你本身的方法。此外，您能夠 根據本身的須要重寫AbpUserManager基類的任何方法。

          UserManager被設計爲一次爲單個租戶工做。它適用於當前租戶做爲默認。咱們來看看UserManager的一些用法：

     

public class MyTestAppService : ApplicationService
{
    private readonly UserManager _userManager;

    public MyTestAppService(UserManager userManager)
    {
        _userManager = userManager;
    }

    public void TestMethod_1()
    {
        //Find a user by email for current tenant
        var user = _userManager.FindByEmail("sampleuser@aspnetboilerplate.com");
    }

    public void TestMethod_2()
    {
        //Switch to tenant 42
        CurrentUnitOfWork.SetFilterParameter(AbpDataFilters.MayHaveTenant, AbpDataFilters.Parameters.TenantId, 42);

        //Find a user by email for the tenant 42
        var user = _userManager.FindByEmail("sampleuser@aspnetboilerplate.com");
    }

    public void TestMethod_3()
    {
        //Disabling MayHaveTenant filter, so we can reach to all users
        using (CurrentUnitOfWork.DisableFilter(AbpDataFilters.MayHaveTenant))
        {
            //Now, we can search for a user name in all tenants
            var users = _userManager.Users.Where(u => u.UserName == "sampleuser").ToList();

            //Or we can add TenantId filter if we want to search for a specific tenant
            var user = _userManager.Users.FirstOrDefault(u => u.TenantId == 42 && u.UserName == "sampleuser");
        }
    }
}

 

用戶登陸

模塊零定義了LoginManager，它具備 用於登陸到應用程序的LoginAsync方法。它檢查全部登陸邏輯並返回登陸結果。LoginAsync方法也會自動保存到數據庫的全部登陸嘗試（即便是失敗的嘗試）。您可使用UserLoginAttempt實體來查詢它。

關於IdentityResults

UserManager的某些方法返回IdentityResult，而不是在某些狀況下拋出異常。這是ASP.NET Identity Framework的本質。模塊零也跟着它。因此，咱們應該檢查這個返回的結果對象，以肯定操做是否成功。

Module-zero定義了CheckErrors擴展方法，該方法自動檢查錯誤並在必要時拋出異常（一個本地化的 UserFriendlyException）。用法示例：

(await UserManager.CreateAsync(user)).CheckErrors();

爲了得到一個本地化的異常，咱們應該提供一個ILocalizationManager實例：

(await UserManager.CreateAsync(user)).CheckErrors(LocalizationManager);

外部認證

module-zero的登陸方法從數據庫中的AbpUsers表中對用戶進行身份驗證。某些應用程序可能須要從某些外部來源（如活動目錄，來自另外一個數據庫的表或甚至遠程服務）對用戶進行身份驗證。

對於這種狀況，UserManager定義了一個名爲「外部認證源」的擴展點。咱們能夠建立一個派生自 IExternalAuthenticationSource的類並註冊到配置中。有DefaultExternalAuthenticationSource類來簡化IExternalAuthenticationSource的實現。咱們來看一個例子：

public class MyExternalAuthSource : DefaultExternalAuthenticationSource<Tenant, User>
{
    public override string Name
    {
        get { return "MyCustomSource"; }
    }

    public override Task<bool> TryAuthenticateAsync(string userNameOrEmailAddress, string plainPassword, Tenant tenant)
    {
        //TODO: authenticate user and return true or false
    }
}

在TryAuthenticateAsync方法中，咱們能夠從某個源檢查用戶名和密碼，若是給定用戶經過此源驗證，則返回true。此外，咱們能夠覆蓋CreateUser和UpdateUser方法來控制用戶建立和更新此源。

當用戶經過外部源進行身份驗證時，module-zero會檢查數據庫中是否存在此用戶（AbpUsers表）。若是不是，則調用CreateUser建立用戶，不然調用UpdateUser以容許認證源更新現有的用戶信息。

咱們能夠在一個應用程序中定義多個外部認證源。AbpUser實體具備AuthenticationSource屬性，該屬性顯示哪一個源驗證了此用戶。

要註冊咱們的認證源，咱們能夠在咱們的模塊的PreInitialize中使用這樣的代碼 ：

Configuration.Modules.Zero（）。UserManagement.ExternalAuthenticationSources.Add < MyExternalAuthSource >（）;

LDAP / Active Directory

LdapAuthenticationSource是外部認證的實現，使用戶可使用其LDAP（活動目錄）用戶名和密碼登陸。

若是咱們想使用LDAP認證，咱們首先添加 Abp.Zero.Ldap nuget包到咱們的項目（通常是核心（域）項目）。那麼咱們應該爲咱們的應用程序擴展LdapAuthenticationSource，以下所示：

public  class MyLdapAuthenticationSource：LdapAuthenticationSource <Tenant，User> 
{ public MyLdapAuthenticationSource（ILdapSettings settings，IAbpZeroLdapModuleConfig ldapModuleConfig）
        ：base（settings，ldapModuleConfig）
    { 
    } 
}
    

最後，咱們應該將模塊依賴關係設置爲AbpZeroLdapModule， 並使用上面建立的認證來啓用 LDAP：

[DependsOn（typeof（AbpZeroLdapModule））] 
public  class MyApplicationCoreModule：AbpModule 
{ public override void PreInitialize（）
    { Configuration.Modules.ZeroLdap（）。Enable（typeof（MyLdapAuthenticationSource））; 
    } 
    ... 
}
    

完成這些步驟以後，將爲您的應用程序啓用LDAP模塊。但LDAP驗證默認狀況下不啓用。咱們可使用設置啓用它。

設置

LdapSettingNames類定義了用於設置名稱的常量。您能夠在更改設置（或獲取設置）時使用這些常量名稱。LDAP設置是每一個租戶（對於多租戶應用程序）。所以，不一樣的租戶有不一樣的設置（請參閱 github上的設置定義 ）。 

正如您在MyLdapAuthenticationSource 構造函數中所看到的，LdapAuthenticationSource指望 ILdapSettings做爲構造函數參數。此接口用於獲取LDAP設置，如域，用戶名和密碼以鏈接到Active Directory。默認實現（LdapSettings類）從設置管理器獲取這些設置。

若是你使用設置管理器，那麼沒有問題。您可使用設置管理器API更改LDAP設置。若是須要，能夠將初始/種子數據添加到數據庫，以默認啓用LDAP身份驗證。

注意：若是您沒有定義域，用戶名和密碼，那麼若是您的應用程序在具備相應權限的域中運行，那麼LDAP身份驗證適用於當前域。

自定義設置

若是你想定義另外一個設置源，你能夠實現一個自定義的ILdapSettings類，以下所示：

public class MyLdapSettings : ILdapSettings
{
    public async Task<bool> GetIsEnabled(int? tenantId)
    {
        return true;
    }

    public async Task<ContextType> GetContextType(int? tenantId)
    {
        return ContextType.Domain;
    }

    public async Task<string> GetContainer(int? tenantId)
    {
        return null;
    }

    public async Task<string> GetDomain(int? tenantId)
    {
        return null;
    }

    public async Task<string> GetUserName(int? tenantId)
    {
        return null;
    }

    public async Task<string> GetPassword(int? tenantId)
    {
        return null;
    }
}

而後在模塊中的PreInitialize方法裏將它註冊到IOC中：

[DependsOn(typeof(AbpZeroLdapModule))]
public class MyApplicationCoreModule : AbpModule
{
    public override void PreInitialize()
    {
        IocManager.Register<ILdapSettings, MyLdapSettings>(); //change default setting source
        Configuration.Modules.ZeroLdap().Enable(typeof (MyLdapAuthenticationSource));
    }

    ...
}

  實戰

 bootstrap table引入

 

       這裏開始bootstrap table,引入項目有兩種方法,一種是直接去官網下載

        地址:http://bootstrap-table.wenzhixin.net.cn/

       另外一種是Nuget引入.

 

       

 

  而後就是把js引用到項目中來,其實Bootstrap js 還有jQuery咱們在模板頁已經引進了,這裏只須要引入bootstrap table相關的js以及中文包就能夠了

<link href="~/Scripts/Content/bootstrap-table/bootstrap-table.css" rel="stylesheet" />
<script src="~/Scripts/Content/bootstrap-table/bootstrap-table.js"></script>
<script src="~/Scripts/Content/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>

前提是建立控制器userinfo,添加index視圖裏面處理,建立視圖的時候自動選擇_Layout做爲模板頁.引入須要的文件以後，咱們最重要的就是定義一個空的table，如上的  <table id="tb_departments"></table>  。固然Bootstrap table還提供了一種簡介的用法，直接在table標籤裏面定義相似「data-...」等相關屬性，就不用再js裏面註冊了，但我以爲這種用法雖然簡單，但不太靈活，遇到父子表等這些高級用法的時候就不太好處理了，因此我們仍是統一使用在js裏面初始化的方式來使用table組件。

    $(function () {



        //1.初始化Table
        var oTable = new TableInit();
        oTable.Init();

        //2.初始化Button的點擊事件
        var oButtonInit = new ButtonInit();
        oButtonInit.Init();

    });
    var Url = "@Url.Action("GetUsersList")";
    var TableInit = function () {
        var oTableInit = new Object();
        //初始化Table
        oTableInit.Init = function () {
            $('#tb_departments').bootstrapTable({
               // url: '../User/GetUsersList',
                url: Url,         //請求後臺的URL（*）
                method: 'get',                      //請求方式（*）
                toolbar: '#toolbar',                //工具按鈕用哪一個容器
                striped: true,                      //是否顯示行間隔色
                cache: false,                       //是否使用緩存，默認爲true，因此通常狀況下須要設置一下這個屬性（*）
                pagination: true,                   //是否顯示分頁（*）
                sortable: false,                     //是否啓用排序
                sortOrder: "asc",                   //排序方式
                queryParams: oTableInit.queryParams,//傳遞參數（*）
                sidePagination: "server",           //分頁方式：client客戶端分頁，server服務端分頁（*）
                pageNumber: 1,                       //初始化加載第一頁，默認第一頁
                pageSize: 2,                       //每頁的記錄行數（*）
                pageList: [10, 25, 50, 100],        //可供選擇的每頁的行數（*）
                search: true,                       //是否顯示錶格搜索，此搜索是客戶端搜索，不會進服務端，因此，我的感受意義不大
                strictSearch: true,
                showColumns: true,                  //是否顯示全部的列
                showRefresh: true,                  //是否顯示刷新按鈕
                minimumCountColumns: 2,             //最少容許的列數
                clickToSelect: true,                //是否啓用點擊選中行
                height: 500,                        //行高，若是沒有設置height屬性，表格自動根據記錄條數以爲表格高度
                uniqueId: "ID",                     //每一行的惟一標識，通常爲主鍵列
                showToggle: true,                    //是否顯示詳細視圖和列表視圖的切換按鈕
                cardView: false,                    //是否顯示詳細視圖
                detailView: false,                   //是否顯示父子表
                columns: [{
                    checkbox: true
                }, {
                    field: 'UserName',
                    title: '姓名'
                }, {
                    field: 'Email',
                    title: '郵箱'
                }, {
                    field: 'Phone',
                    title: '手機'
                }, {
                    field: 'Address',
                    title: '地址'
                }, ]
            });
        };

        //獲得查詢的參數
        oTableInit.queryParams = function (params) {
            var temp = {   //這裏的鍵的名字和控制器的變量名必須一直，這邊改動，控制器也須要改爲同樣的
                limit: params.limit,   //頁面大小
                offset: params.offset,  //頁碼
                departmentname: $("#txt_search_departmentname").val(),
                statu: $("#txt_search_statu").val()
            };
            return temp;
        };
        return oTableInit;
    };

         表格的初始化也很簡單，定義相關的參數便可。上面一些博主以爲重要的參數都加了註釋，而且初始化Table必須的幾個參數也用（*）作了標記，若是你的表格也有太多的頁面需求，直接用必須的參數就能解決。一樣，在columns參數裏面其實也有不少的參數須要設置，好比列的排序，對齊，寬度等等。這些比較簡單，不會涉及表格的功能，看看API就能搞定。

      這裏須要注意的是@Url.Action,var Url = "@Url.Action("GetUsersList")";/ UserInfo/ GetUsersList,直接指定後臺的控制器裏面的方法.

   public class UserInfoController : Controller
    {
        private readonly IUserService _iUsersService;

        public UserInfoController(IUserService iUsersService)
        {

            _iUsersService = iUsersService;

        }
        // GET: Admin/UserInfo
        public ActionResult Index()
        {
            return View();
        }

        [DisableAbpAntiForgeryTokenValidation]
        [HttpGet]
        [DontWrapResult] //不須要AbpJsonResult
        public JsonResult GetUsersList()
        {
            string pageNumber = string.IsNullOrWhiteSpace(Request["pageNumber"]) ? "0" : Request["pageNumber"];
            string pageSize = string.IsNullOrWhiteSpace(Request["pageSize"]) ? "20" : Request["pageSize"];
            List<UserInfoDto> Userlist = new List<UserInfoDto>();
            Userlist = _iUsersService.GetAllList().ToList();
            int totaldata = Userlist.Count();
            Userlist = Userlist.Skip(int.Parse(pageNumber) * int.Parse(pageSize)).Take(int.Parse(pageSize)).ToList();
            var result = new { total = totaldata, rows = Userlist };
            return Json(result, JsonRequestBehavior.AllowGet);
        }
    }

   注意事項

     

   這裏有一點須要注意：若是是服務端分頁，返回的結果必須包含total、rows兩個參數。漏寫或錯寫都會致使表格沒法顯示數據。相反，若是是客戶端分頁，這裏要返回一個集合對象到前端。固然我這裏爲了快捷,我沒有去服務裏面處理分頁,直接在這裏分頁,這種作法其實很low,按照以前的作法會專門封裝一個分頁DTO,而後添加自定義排序字段.我這裏就不去處理了,有興趣的本身去弄一下,這些會在我下一個項目裏面詳細講.這裏我再網上找一張一圖片來看一下具體代碼的應用.

        

crud功能

     

 其實這些信息在API裏面應該都有,本身看一下就能夠了.

     我這裏分頁和菜單是本身寫的,crud的功能都是有的.

     

var ButtonInit = function () {
        var oInit = new Object();
        var postdata = {};

        oInit.Init = function () {
            //初始化頁面上面的按鈕事件
            //查詢角色
            $("#btn_query").click(function () {
                var actionUrl = "@Url.Action("GetUsersList")";
                m_pagerow = 0;
                $("#tb_departments").bootstrapTable('refresh', { url: actionUrl });

            });
            //新增角色
            $("#btn_add").click(function () {

                $("#id").val("");
                $("#txt_Surname").val("");
                $("#txt_Name").val("");
                $("#txt_UserName").val("");
                $("#txt_isDeleted").val("");

                $("#myModalLabel").text("新增");
                $('#myModal').modal();
            });
            //新增角色
            $("#btn_submit").click(function () {

                var actionUrl = "@Url.Action("Create")";
                var UserName = $("#txt_Surname").val();
                var Email = $("#txt_Name").val();
                var Phone = $("#txt_UserName").val();
                var isnull = $("#txt_isDeleted").val();
                var isDeleted = true;
                if (isnull=="") {
                    isDeleted = false;
                }
                var Id = $("#id").val() == "" ? 0 : $("#id").val();
                debugger;
                $.ajax({
                    type: 'post',
                    dataType: "Json",
                    url: actionUrl,
                    data: { Id: Id, UserName: UserName, Email: Email, Phone: Phone, isDeleted: isDeleted },
                    beforeSend: function (XMLHttpRequest) {
                    },
                    success: function (data, textStatus) { //請求成功後處理函數。
                        toastr.warning('操做成功!');
                        var actionUrl = "@Url.Action("GetUsersList")";
                        m_pagerow = 0;
                        $("#tb_departments").bootstrapTable('refresh', { url: actionUrl });
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                    }
                });
                });
            //編輯角色
            $("#btn_edit").click(function () {
                debugger;
                var arrselections = $("#tb_departments").bootstrapTable('getSelections');
                if (arrselections.length > 1) {
                    toastr.warning('只能選擇一行進行編輯');
                    return;
                }
                if (arrselections.length <= 0) {
                    toastr.warning('請選擇有效數據');
                    return;
                }
                $("#id").val(arrselections[0].Id);
                $("#txt_Surname").val(arrselections[0].UserName);
                $("#txt_Name").val(arrselections[0].Email);
                $("#txt_UserName").val(arrselections[0].Phone);
                $("#txt_isDeleted").val(arrselections[0].Id);

                $("#myModalLabel").text("修改");
                $('#myModal').modal();
                //ShowModal(actionUrl, param, "編輯角色");
            });
            //刪除角色
            $("#btn_delete").click(function () {
                var actionUrl = "@Url.Action("DelUserById")";
                var arrselections = $("#tb_departments").bootstrapTable('getSelections');
                if (arrselections.length > 1) {
                    toastr.warning('只能選擇一行進行編輯');
                    return;
                }
                if (arrselections.length <= 0) {
                    toastr.warning('請選擇有效數據');
                    return;
                }
                var Id = arrselections[0].Id;
                debugger;
                $.ajax({
                    type: 'post',
                    dataType: "Json",
                    url: actionUrl,
                    data: { Id:Id},
                    beforeSend: function (XMLHttpRequest) {
                    },
                    success: function (data, textStatus) { //請求成功後處理函數。
                        toastr.warning('操做成功!');
                        var actionUrl = "@Url.Action("GetUsersList")";
                        m_pagerow = 0;
                        $("#tb_departments").bootstrapTable('refresh', { url: actionUrl });
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                    }
                });
            });
            //權限受權
            $("#btn_authorize").click(function () {
                var arrselections = $("#tb_departments").bootstrapTable('getSelections');
                if (arrselections.length > 1) {
                    toastr.warning('只能選擇一個角色進行受權');
                    return;
                }
                if (arrselections.length <= 0) {
                    toastr.warning('請選擇有效數據');
                    return;
                }
                var actionUrl = "@Url.Action("AuthorizePermission")";
                var param = { id: arrselections[0].Id };
                ShowModal_Authorize(actionUrl, param, "權限受權");
            });
            //模態框中「權限受權」保存
            var $modal = $("#authorizeModal");
            $("#btnSave", $modal).click(function () {
                var actionUrl = "@Url.Action("AuthorizePermission")";
                SaveModal_Authorize(actionUrl);
            });
            //模態框中「新增編輯角色」保存
            var $formmodal = $("#modal-form");
            $("#btnSave", $formmodal).click(function () {
                var $tb = $("#tb_departments");
                SaveModal($tb);
            });

            /*******彈出表單*********/
            function ShowModal(actionUrl, param, title) {
                debugger;
                var $modal = $("#modal-form");
                //表單初始化
                $(".modal-title", $modal).html(title);
                $("#modal-content", $modal).attr("action", actionUrl);

                $.ajax({
                    type: "GET",
                    url: actionUrl,
                    data: param,
                    beforeSend: function () {
                    },
                    success: function (result) {
                        debugger;
                        $("#modal-content").html(result);
                        $('#modal-form').modal('show');
                    },
                    error: function () {

                    },
                    complete: function () {

                    }
                });
            }


        };

        return oInit;
    };

    自定義菜單以及彈樣式及功能.

  

<section class="content-header">
    <h1>
        用戶明細
        <small>advanced cxdmles</small>
    </h1>
    <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> 主頁</a></li>
        <li><a href="#">用戶管理</a></li>
        <li class="active">用戶列表</li>
    </ol>

</section>
<section class="content">
    <div class="panel-body" style="padding-bottom:0px;">
        <div class="panel panel-default">
            <div class="panel-heading">查詢條件</div>
            <div class="panel-body">
                <form id="formSearch" class="form-horizontal">
                    <div class="form-group" style="margin-top:15px">
                        <label class="control-label col-sm-1" for="txt_search_departmentname">姓名</label>
                        <div class="col-sm-3">
                            <input type="text" class="form-control" id="txt_search_departmentname">
                        </div>
                        <label class="control-label col-sm-1" for="txt_search_statu">暱稱</label>
                        <div class="col-sm-3">
                            <input type="text" class="form-control" id="txt_search_statu">
                        </div>
                        <div class="col-sm-4" style="text-align:left;">
                            <button type="button" style="margin-left:50px" id="btn_query" class="btn btn-primary">查詢</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>

        <div id="toolbar" class="btn-group">
            <button id="btn_add" type="button" class="btn btn-success">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
            </button>
            <button id="btn_edit" type="button" class="btn btn-warning">
                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>修改
            </button>
            <button id="btn_delete" type="button" class="btn btn-danger">
                <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>刪除
            </button>
            <button id="btn_authorize" type="button" class="btn btn-info ">
                <span class="glyphicon glyphicon-lock" aria-hidden="true"></span>受權
            </button>

        </div>
        <table id="tb_departments"></table>
    </div>


    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                    <h4 class="modal-title" id="myModalLabel"></h4>
                </div>
                <div class="modal-body">

                    <div class="form-group">
                        <label for="txt_departmentname">姓名</label>
                        <input type="text" name="id" class="form-control" id="id" placeholder="id" style="display:none">
                        <input type="text" name="txt_departmentname" class="form-control" id="txt_Surname" placeholder="真實姓名">
                    </div>
                    <div class="form-group">
                        <label for="txt_parentdepartment">郵箱</label>
                        <input type="text" name="txt_parentdepartment" class="form-control" id="txt_Name" placeholder="姓名">
                    </div>
                    <div class="form-group">
                        <label for="txt_departmentlevel">手機</label>
                        <input type="text" name="txt_departmentlevel" class="form-control" id="txt_UserName" placeholder="部門級別">
                    </div>
                    <div class="form-group">
                        <label for="txt_departmentlevel">是否啓用</label>
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" disabled="disabled">
                            </label>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>關閉</button>
                    <button type="button" id="btn_submit" class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>保存</button>
                </div>
            </div>
        </div>
    </div>

</section>

 控制器方法

 

 這裏的菜單其實也是bootstrap 樣式.表單也是.看下控制器方法.都很簡單.

  

        public ActionResult Create()
        {
            var model = new UserInfoDto();
            return PartialView(model);
        }
        [HttpPost]
        public ActionResult Create(UserInfoDto roleVm)
        {
            var result = _iUsersService.AddUserList(roleVm);
            return Json(result);
        }
        [DisableAbpAntiForgeryTokenValidation]
        [HttpPost]
        [DontWrapResult]
        public ActionResult DelUserById(string Id)
        {
            var result = _iUsersService.DelUsers(Id);
            return Json(result);
        }

Service方法

 

    Service方法.無需細說,一看就懂，注意遞歸

    public class UserService : IUserService
    {
        private readonly IRepository<Users, int> _userRepository;
        public ILogger Logger { get; set; }
        public UserService(IRepository<Users, int> userRepository)
        {
            Logger = NullLogger.Instance;
            _userRepository = userRepository;
        }
        public async Task AddUserList(UserInfoDto model)
        {
            var user = model.MapTo<Users>();
            await _userRepository.InsertAsync(user);
        }

        public async Task DelUsers(string id)
        {
            try
            {
                Users user = _userRepository.Get(Int32.Parse(id));
                await _userRepository.DeleteAsync(user);
            }
            catch (Exception ex)
            {

                throw;
            }
        }
        public async Task<ListResultDto<UserInfoDto>> GetUsers()
        {
            var users = await _userRepository.GetAllListAsync();

            return new ListResultDto<UserInfoDto>(
                users.MapTo<List<UserInfoDto>>()
                );
        }
        public List<UserInfoDto> GetAllList()
        {
            var users = _userRepository.GetAllListAsync();
            return new List<UserInfoDto>(
                users.MapTo<List<UserInfoDto>>()
                );
        }
    }

 

  效果

   

 

 

 

 

 

自此,用戶列表.

 

返回總目錄:ABP+AdminLTE+Bootstrap Table權限管理系統一期