ABP+AdminLTE+Bootstrap Table权限管理系统第十节--AdminLTE模板菜单处理

ABP+AdminLTE+Bootstrap Table权限管理系统一期
Github:https://github.com/Jimmey-Jiang/ABP-ASP.NET-Boilerplate-Project-CMS
前往博客园总目录:ABP+AdminLTE+Bootstrap Table权限管理系统一期

上节我们把布局页,也有的临时的菜单,但是菜单不是应该动态加载的么?,所以我们这节来写菜单.首先我们看一下AdminLTE源码里面的菜单以及结构.


对,用ul标签和li标签包装起来的树.其实菜单都是树形结构,既然是树,那就涉及到父子结构,所以我们表就要有父菜单id,还要菜单名字,既然是菜单,要有菜单的连接,菜单是否启用,创建时间等.首先根据我们想到字段我们来设计dto

using Abp.AutoMapper;
using Abp.Domain.Entities;
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace JCmsErp.Meuns
{
    /// 
    /// 菜单
    /// 
    [Serializable]
    [AutoMapFrom(typeof(Meun))]
    public class MeunDto
    {  /// 
       /// id
       /// 
        public int Id { get; set; }
        /// 
        /// 父模块Id
        /// 
        public int? ParentId { get; set; }
        /// 
        /// 名称
        /// 
        [Required]
        [StringLength(20)]
        public string Name { get; set; }
        /// 
        /// 链接地址
        /// 
        [Required]
        [StringLength(50)]
        public string LinkUrl { get; set; }

        /// 
        /// 是否是菜单
        /// 
        public bool IsMenu { get; set; }
        /// 
        /// 模块编号
        /// 
        public int Code { get; set; }
        /// 
        /// 描述
        /// 
        [StringLength(100)]
        public string Description { get; set; }
        /// 
        /// 是否激活
        /// 
        public bool Enabled { get; set; }

        public DateTime UpdateDate { get; set; }

        //public virtual MeunDto ParentModule { get; set; }
        //public List ChildModules { get; private set; }
        public List children { get; set; }
    }
}

有了dto,我们就可以根据dto设计表结构


ABP+AdminLTE+Bootstrap Table权限管理系统第十节--AdminLTE模板菜单处理_第1张图片

生成sql语句.

USE [JCmsErp];
GO


SET ANSI_NULLS ON;
GO

SET QUOTED_IDENTIFIER ON;
GO

CREATE TABLE [dbo].[Modules]
    (
      [Id] [INT] IDENTITY(1, 1)
                 NOT NULL ,
      [ParentId] [INT] NULL ,
      [Name] [NVARCHAR](20) NOT NULL ,
      [LinkUrl] [NVARCHAR](50) NOT NULL ,
      [IsMenu] [BIT] NOT NULL ,
      [Code] [INT] NOT NULL ,
      [Description] [NVARCHAR](100) NULL ,
      [Enabled] [BIT] NOT NULL ,
      [UpdateDate] [DATETIME] NOT NULL ,
      CONSTRAINT [PK_dbo.Modules] PRIMARY KEY CLUSTERED ( [Id] ASC )
        WITH ( PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF,
               IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON,
               ALLOW_PAGE_LOCKS = ON ) ON [PRIMARY]
    )
ON  [PRIMARY];

GO

有了dto和表,我们就可以设计model

using Abp.Domain.Entities;
using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace JCmsErp.Meuns
{
    public class Meun : Entity
    {
        public int? ParentId { get; set; }
        [Required]
        [StringLength(20)]
        public string Name { get; set; }
        [Required]
        [StringLength(50)]
        public string LinkUrl { get; set; }
        [StringLength(100)]
        public string Description { get; set; }
        public bool IsMenu { get; set; }
        public int Code { get; set; }
        public bool Enabled { get; set; }

        public DateTime UpdateDate { get; set; }

    }
}

首先我们在JCmsErp.EntityFramework的JCmsErpDbContext的OnModelCreating方法添加如下代码

modelBuilder.Entity().ToTable("[dbo].[Modules]");

JCmsErpDbContext方法下添加如下代码:

public virtual IDbSet Modules { get; set; }

有了以上的基础,我们才能创建接口IMeunService和服务MeunService,这里还没涉及到菜单的curd,所以我们只需建一个关于select方法就行.
既然是父子结构就会涉及到递归.


ABP+AdminLTE+Bootstrap Table权限管理系统第十节--AdminLTE模板菜单处理_第2张图片

然后我们LayoutController控制器引入接口调用MeunService的GetMeunList方法就完整的菜单了,我在数据库插入一部分数据.


ABP+AdminLTE+Bootstrap Table权限管理系统第十节--AdminLTE模板菜单处理_第3张图片

看下LayoutController代码:

private readonly IMeunService _iMeunService;
        public LayoutController(IMeunService iMeunService) {
            _iMeunService = iMeunService;
        }
        List modules = new List();

        public ActionResult _LeftSideMenus()
        {
            MeunViewModel model = new MeunViewModel();
            List modules = _iMeunService.GetMeunList();
            model._LPBasicSet = modules;
            return PartialView("_LeftSideMenus", model);
        }
 试图肯定不能用AdminLTE为我们提供的默认的菜单啊,需要我们改造一下.对了需要添加一个ViewModel

我已经添加好了

using JCmsErp.Meuns;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace JCmsErp.Web.Areas.Common.Models
{
    public class MeunViewModel
    {
        public List _LPBasicSet = new List();
        public List LPBasicSet
        {
            get { return _LPBasicSet; }
            set { _LPBasicSet = value; }
        }
    }
}

看下试图代码:

@model JCmsErp.Web.Areas.Common.Models.MeunViewModel
@{
    Layout = null;
}



这里只需要foreach一下输出就可以了.需要注意的是关于AdminLTE的app.min.js的应用,开始我也不清楚,数据F12出来了,但是树死活点击不开,后来折腾了半天是这个js没有引用.


ABP+AdminLTE+Bootstrap Table权限管理系统第十节--AdminLTE模板菜单处理_第4张图片

至此,菜单完毕.

返回总目录:ABP+AdminLTE+Bootstrap Table权限管理系统一期
前往博客园总目录:ABP+AdminLTE+Bootstrap Table权限管理系统一期

你可能感兴趣的:(ABP+AdminLTE+Bootstrap Table权限管理系统第十节--AdminLTE模板菜单处理)