合并时提交的菜单管理前台展示

Bootstrap.Admin/Bootstrap.Admin.csproj

@@ -155,6 +155,7 @@
     <Content Include="Scripts\Groups.js" />
     <Content Include="Scripts\icon.js" />
     <Content Include="Scripts\Login.js" />
+    <Content Include="Scripts\Menus.js" />
     <Content Include="Scripts\Roles.js" />
     <Content Include="Scripts\Users.js" />
     <Content Include="Content\js\jquery-1.10.2.js" />
@@ -184,12 +185,14 @@
     <Compile Include="Controllers\AdminController.cs" />
     <Compile Include="Controllers\GroupsController.cs" />
     <Compile Include="Controllers\HomeController.cs" />
+    <Compile Include="Controllers\MenusController.cs" />
     <Compile Include="Controllers\RolesController.cs" />
     <Compile Include="Controllers\UsersController.cs" />
     <Compile Include="Global.asax.cs">
       <DependentUpon>Global.asax</DependentUpon>
     </Compile>
     <Compile Include="Models\QueryGroupOption.cs" />
+    <Compile Include="Models\QueryMenuOption.cs" />
     <Compile Include="Models\QueryRoleOption.cs" />
     <Compile Include="Models\QueryUserOption.cs" />
     <Compile Include="Models\HeaderBarModel.cs" />
@@ -220,6 +223,7 @@
     <Content Include="Views\Admin\FAIcon.cshtml" />
     <Content Include="Views\Admin\Groups.cshtml" />
     <Content Include="Views\Admin\Roles.cshtml" />
+    <Content Include="Views\Admin\Menus.cshtml" />
     <Content Include="Views\Shared\Glyphicons.cshtml" />
     <Content Include="Views\Shared\RoleConfig.cshtml" />
     <None Include="Web.Debug.config">

Bootstrap.Admin/Controllers/AdminController.cs

@@ -54,6 +54,15 @@ namespace Bootstrap.Admin.Controllers
             v.HomeUrl = "~/Admin";
             return View(v);
         }
+        public ActionResult Menus()
+        {
+            var v = new NavigatorBarModel();
+            v.BreadcrumbName = "菜单管理";
+            v.ShowMenu = "hide";
+            v.Menus[0].Active = "active";
+            v.HomeUrl = "~/Admin";
+            return View(v);
+        }
         /// <summary>
         /// 
         /// </summary>

Bootstrap.Admin/Controllers/MenusController.cs

@@ -0,0 +1,52 @@
+using Bootstrap.Admin.Models;
+using Bootstrap.DataAccess;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Web;
+using System.Web.Http;
+
+namespace Bootstrap.Admin.Controllers
+{
+    public class MenusController : ApiController
+    {
+        /// <summary>
+        /// 
+        /// </summary>
+        /// <param name="value"></param>
+        /// <returns></returns>
+        [HttpGet]
+        public QueryData<Menu> Get([FromUri]QueryMenuOption value)
+        {
+            return value.RetrieveData();
+        }
+        /// <summary>
+        /// 
+        /// </summary>
+        /// <param name="id"></param>
+        /// <returns></returns>
+        [HttpGet]
+        public Menu Get(int id)
+        {
+            return MenuHelper.RetrieveMenus().FirstOrDefault(t => t.ID == id);
+        }
+        /// <summary>
+        /// 
+        /// </summary>
+        /// <param name="value"></param>
+        [HttpPost]
+        public bool Post([FromBody]Menu value)
+        {
+            return MenuHelper.SaveMenu(value);
+        }
+        /// <summary>
+        /// 
+        /// </summary>
+        /// <param name="id"></param>
+        [HttpDelete]
+        public bool Delete([FromBody]string value)
+        {
+            return MenuHelper.DeleteMenu(value);
+        }
+    }
+}

Bootstrap.Admin/Models/QueryMenuOption.cs

@@ -0,0 +1,41 @@
+using Bootstrap.DataAccess;
+using Longbow.Web.Mvc;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Web;
+
+namespace Bootstrap.Admin.Models
+{
+    public class QueryMenuOption : PaginationOption
+    {
+        /// <summary>
+        /// 
+        /// </summary>
+        public string Name { get; set; }
+        /// <summary>
+        /// 
+        /// </summary>
+        public string Category { get; set; }
+
+        public QueryData<Menu> RetrieveData()
+        {
+            // int limit, int offset, string name, string price, string sort, string order
+            var data = MenuHelper.RetrieveMenus(string.Empty);
+            if (!string.IsNullOrEmpty(Name))
+            {
+                data = data.Where(t => t.Name.Contains(Name));
+            }
+            if (!string.IsNullOrEmpty(Category))
+            {
+                data = data.Where(t => t.Category.Contains(Category));
+            }
+            var ret = new QueryData<Menu>();
+            ret.total = data.Count();
+            // TODO: 通过option.Sort属性判断对那列进行排序，现在统一对名称列排序
+            data = Order == "asc" ? data.OrderBy(t => t.Name) : data.OrderByDescending(t => t.Name);
+            ret.rows = data.Skip(Offset).Take(Limit);
+            return ret;
+        }
+    }
+}

Bootstrap.Admin/Scripts/Menus.js

@@ -0,0 +1,53 @@
+$(function () {
+    var bsa = new BootstrapAdmin({
+        url: '../api/Menus',
+        dataEntity: new DataEntity({
+            map: {
+                ID: "menuID",
+                ParentId: "parentId",
+                Name: "name",
+                Order: "order",
+                Icon: "icon",
+                Url: "url",
+                Category: "category"
+            }
+        })
+    });
+
+    $('table').smartTable({
+        url: '../api/Menus',            //请求后台的URL（*）
+        sortName: 'UserName',
+        queryParams: function (params) { return $.extend(params, { name: $("#txt_menus_name").val(), category: $('#txt_menus_category').val() }); },           //传递参数（*）
+        columns: [{ checkbox: true },
+            { title: "Id", field: "ID", events: bsa.idEvents(), formatter: BootstrapAdmin.idFormatter },
+            { title: "父级Id", field: "ParentId", sortable: false },
+            { title: "菜单名称", field: "Name", sortable: true },
+            { title: "菜单序号", field: "Order", sortable: false },
+            { title: "菜单图标", field: "Icon", sortable: false },
+            { title: "菜单路径", field: "Url", sortable: false },
+            { title: "菜单类别", field: "Category", sortable: false }
+        ]
+    });
+
+    // validate
+    $('#dataForm').autoValidate({
+        name: {
+            required: true,
+            maxlength: 50
+        },
+        icon: {
+            required: true,
+            maxlength: 50
+        },
+        url: {
+            required: true,
+            maxlength: 50
+        },
+        category: {
+            required: true,
+            maxlength: 50
+        }
+    });
+
+    //TODO: 客户端点击保存用户后，要更新页面右上角用户显示名称
+});

Bootstrap.Admin/Views/Admin/Menus.cshtml

@@ -0,0 +1,64 @@
+@model NavigatorBarModel
+@{
+    ViewBag.Title = "菜单管理";
+    Layout = "~/Views/Shared/_Default.cshtml";
+}
+@section Javascript {
+    <script src="~/scripts/Menus.js"></script>
+}
+@section header {
+    @Html.Partial("Header", Model)
+}
+@section navigator {
+    @Html.Partial("Navigator", Model)
+}
+@section query {
+    <form class="form-inline" role="form">
+        <div class="form-group col-lg-5">
+            <label class="control-label" for="txt_menus_name">菜单名称</label>
+            <input type="text" class="form-control" id="txt_menus_name" />
+        </div>
+        <div class="form-group col-lg-5">
+            <label class="control-label" for="txt_menus_category">菜单类别</label>
+            <input type="text" class="form-control" id="txt_menus_category" />
+        </div>
+        <div class="form-group col-lg-2">
+            <button type="button" id="btn_query" class="btn btn-primary"><span class="glyphicon glyphicon-search" aria-hidden="true"></span>查询</button>
+        </div>
+    </form>
+}
+@section modal {
+    <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+        <h4 class="modal-title" id="myModalLabel">用户编辑窗口</h4>
+    </div>
+    <div class="modal-body">
+        <form class="form-inline" id="dataForm" name="dataForm" role="form">
+            <div class="form-group col-lg-6">
+                <label class="control-label" for="parentId">父级ID</label>
+                <input type="text" class="form-control" id="parentId" name="parentId" maxlength="50" />
+            </div>
+            <div class="form-group col-lg-6">
+                <label class="control-label" for="name">菜单名称</label>
+                <input type="text" class="form-control" id="name" name="name" maxlength="50" />
+                <input type="text" class="form-control hide" id="menuID" name="menuID" />
+            </div>
+            <div class="form-group col-lg-6">
+                <label class="control-label" for="order">菜单序号</label>
+                <input type="text" class="form-control" id="order" name="order" />
+            </div>
+            <div class="form-group col-lg-6">
+                <label class="control-label" for="icon">菜单图标</label>
+                <input type="text" class="form-control" id="icon" name="icon" maxlength="50" />
+            </div>
+            <div class="form-group col-lg-6">
+                <label class="control-label" for="url">路径</label>
+                <input type="text" class="form-control" id="url" name="url" maxlength="50" />
+            </div>
+            <div class="form-group col-lg-6">
+                <label class="control-label" for="category">类别</label>
+                <input type="text" class="form-control" id="category" name="category" maxlength="50" />
+            </div>
+        </form>
+    </div>
+}

Bootstrap.DataAccess/Menu.cs

@@ -43,7 +43,7 @@ namespace Bootstrap.DataAccess
         public static List<Menu> RetrieveMenus()
         {
             return new List<Menu>() {
-                new Menu() { Name = "菜单管理", Icon = "fa-dashboard", Url="javascript:;", Active = "" },
+                new Menu() { Name = "菜单管理", Icon = "fa-dashboard", Url="/Admin/Menus", Active = "" },
                 new Menu() { Name = "用户管理", Icon = "fa-user", Url="/Admin/Users", Active = "" },
                 new Menu() { Name = "角色管理", Icon = "fa-sitemap", Url="/Admin/Roles", Active = "" },
                 new Menu() { Name = "部门管理", Icon = "fa-home", Url="/Admin/Groups", Active = "" },