ABP+AdminLTE+Bootstrap Table权限管理系统第九节--AdminLTE引入及模板页和布局和菜单

返回总目录:ABP+AdminLTE+Bootstrap Table权限管理系统一期

 AdminLTE 

AdminLTE 官网地址:https://adminlte.io/themes/AdminLTE/index2.html

  首先去官网下载包下来,然后引入项目.

  然后我们在web层添加区域Admin以及Common,关于AdminLTE的地址我们放在Common路劲下面.

  在Common下添加LayoutController控制器.

Layout

这里菜单我们先不管,在后面的章节我在加上,首先是_Layout页代码:

 1 @{
 2     Layout = null;
 3 }
 4 
 5 @using System.Web.Optimization
 6 @{
 7     List<JCmsErp.Menu.Menus> sidebarMenuDataList = ViewBag.SidebarMenuModel;
 8 }
 9 <!DOCTYPE html>
10 <html>
11 <head>
12     <meta charset="UTF-8" />
13     <title>AdminLTE 2 | Dashboard</title>
14     <meta http-equiv="X-UA-Compatible" content="IE=edge">
15     <script src="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/jQuery/jQuery-2.1.4.min.js"></script>
16 
17     <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport' />
18     <!-- Bootstrap 3.3.4 -->
19     <script src="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/bootstrap/js/bootstrap.js"></script>
20     <link href="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/bootstrap/css/bootstrap.css" rel="stylesheet" />
21     <!-- FontAwesome 4.3.0 -->
22     <!-- Ionicons 2.0.0 -->
23     <link href="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/dist/css/ionicons.min.css" rel="stylesheet" type="text/css" />
24     <!-- Theme style -->
25     <link href="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/dist/css/AdminLTE.min.css" rel="stylesheet" type="text/css" />
26     <!-- AdminLTE Skins. Choose a skin from the css/skins
27          folder instead of downloading all of them to reduce the load. -->
28     <link href="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/dist/css/skins/_all-skins.min.css" rel="stylesheet" type="text/css" />
29     <!-- iCheck -->
30     <link href="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/iCheck/flat/blue.css" rel="stylesheet" type="text/css" />
31     <!-- Morris chart -->
32     <link href="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/morris/morris.css" rel="stylesheet" type="text/css" />
33     <!-- jvectormap -->
34     <link href="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/jvectormap/jquery-jvectormap-1.2.2.css" rel="stylesheet" type="text/css" />
35     <!-- Date Picker -->
36     <link href="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/datepicker/datepicker3.css" rel="stylesheet" type="text/css" />
37     <!-- Daterange picker -->
38     <link href="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/daterangepicker/daterangepicker-bs3.css" rel="stylesheet" type="text/css" />
39     <!-- bootstrap wysihtml5 - text editor -->
40     <link href="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css" rel="stylesheet" type="text/css" />
41 
42     <!-- ./wrapper -->
43     <!-- REQUIRED JS SCRIPTS -->
44     <!-- jQuery 2.2.3 -->
45 
46 
47     <style type="text/css">
48         body {
49             font-family: verdana,helvetica,arial,sans-serif;
50             padding: 0 !important;
51             margin: 0;
52         }
53       
54         .content {
55           min-height:700px; height:auto!important;
56         }
57     </style>
58 
59 </head>
60 
61 <body class="hold-transition skin-blue sidebar-mini">
62     <div class="wrapper">
63         @Html.Action("_MainHeader", "Layout", new { area = "Common" })
64         @Html.Action("_LeftSideMenus", "Layout", new { area = "Common" })
65 
66         <div class="content-wrapper">
67             @RenderBody()
68         </div>
69         @Html.Action("_MainFooter", "Layout", new { area = "Common" })
70         <div class="control-sidebar-bg"></div>
71     </div>
72 </body>
73 </html>
View Code

这里总的模板页.以后在其他地方引用的话就引用这个页面.

头部页面

接下来是头部页面:

  1 @{
  2     Layout = null;
  3 }
  4 
  5 <header class="main-header">
  6     <!-- Logo -->
  7     <a href="@Url.Action("Index", "Home", new { area="Common"})" class="logo">
  8         <!-- mini logo for sidebar mini 50x50 pixels -->
  9         <span class="logo-mini"><b>RMS</b></span>
 10         <!-- logo for regular state and mobile devices -->
 11         <span class="logo-lg"><b>WY</b>RMS</span>
 12     </a>
 13     <!-- Header Navbar -->
 14     <nav class="navbar navbar-static-top" role="navigation">
 15         <!-- Sidebar toggle button-->
 16         <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
 17             <span class="sr-only">Toggle navigation</span>
 18         </a>
 19         <!-- Navbar Right Menu -->
 20         <div class="navbar-custom-menu">
 21             <ul class="nav navbar-nav">
 22                 <!-- Messages: style can be found in dropdown.less-->
 23                 <li class="dropdown messages-menu">
 24                     <!-- Menu toggle button -->
 25                     <a href="#" class="dropdown-toggle" data-toggle="dropdown">
 26                         <i class="fa fa-envelope-o"></i>
 27                         <span class="label label-success">4</span>
 28                     </a>
 29                     <ul class="dropdown-menu">
 30                         <li class="header">You have 4 messages</li>
 31                         <li>
 32                             <!-- inner menu: contains the messages -->
 33                             <ul class="menu">
 34                                 <li>
 35                                     <!-- start message -->
 36                                     <a href="#">
 37                                         <div class="pull-left">
 38                                             <!-- User Image -->
 39                                             <img src="@Url.Content("/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/dist/img/avatar04.png")" class="img-circle" alt="User Image">
 40                                         </div>
 41                                         <!-- Message title and timestamp -->
 42                                         <h4>
 43                                             Support Team
 44                                             <small><i class="fa fa-clock-o"></i> 5 mins</small>
 45                                         </h4>
 46                                         <!-- The message -->
 47                                         <p>Why not buy a new awesome theme?</p>
 48                                     </a>
 49                                 </li><!-- end message -->
 50                             </ul><!-- /.menu -->
 51                         </li>
 52                         <li class="footer"><a href="#">See All Messages</a></li>
 53                     </ul>
 54                 </li><!-- /.messages-menu -->
 55                 <!-- Notifications Menu -->
 56                 <li class="dropdown notifications-menu">
 57                     <!-- Menu toggle button -->
 58                     <a href="#" class="dropdown-toggle" data-toggle="dropdown">
 59                         <i class="fa fa-bell-o"></i>
 60                         <span class="label label-warning">10</span>
 61                     </a>
 62                     <ul class="dropdown-menu">
 63                         <li class="header">You have 10 notifications</li>
 64                         <li>
 65                             <!-- Inner Menu: contains the notifications -->
 66                             <ul class="menu">
 67                                 <li>
 68                                     <!-- start notification -->
 69                                     <a href="#">
 70                                         <i class="fa fa-users text-aqua"></i> 5 new members joined today
 71                                     </a>
 72                                 </li><!-- end notification -->
 73                             </ul>
 74                         </li>
 75                         <li class="footer"><a href="#">View all</a></li>
 76                     </ul>
 77                 </li>
 78                 <!-- Tasks Menu -->
 79                 <li class="dropdown tasks-menu">
 80                     <!-- Menu Toggle Button -->
 81                     <a href="#" class="dropdown-toggle" data-toggle="dropdown">
 82                         <i class="fa fa-flag-o"></i>
 83                         <span class="label label-danger">9</span>
 84                     </a>
 85                     <ul class="dropdown-menu">
 86                         <li class="header">You have 9 tasks</li>
 87                         <li>
 88                             <!-- Inner menu: contains the tasks -->
 89                             <ul class="menu">
 90                                 <li>
 91                                     <!-- Task item -->
 92                                     <a href="#">
 93                                         <!-- Task title and progress text -->
 94                                         <h3>
 95                                             Design some buttons
 96                                             <small class="pull-right">20%</small>
 97                                         </h3>
 98                                         <!-- The progress bar -->
 99                                         <div class="progress xs">
100                                             <!-- Change the css width attribute to simulate progress -->
101                                             <div class="progress-bar progress-bar-aqua" style=" 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
102                                                 <span class="sr-only">20% Complete</span>
103                                             </div>
104                                         </div>
105                                     </a>
106                                 </li><!-- end task item -->
107                             </ul>
108                         </li>
109                         <li class="footer">
110                             <a href="#">View all tasks</a>
111                         </li>
112                     </ul>
113                 </li>
114                 <!-- User Account Menu -->
115                 <li class="dropdown user user-menu">
116                     <!-- Menu Toggle Button -->
117                     <a href="#" class="dropdown-toggle" data-toggle="dropdown">
118                         <!-- The user image in the navbar-->
119                         <img src="@Url.Content("/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/dist/img/avatar04.png")" class="user-image" alt="User Image">
120                         <!-- hidden-xs hides the username on small devices so only the image appears. -->
121                         <span class="hidden-xs">管理员</span>
122                     </a>
123                     <ul class="dropdown-menu">
124                         <!-- The user image in the menu -->
125                         <li class="user-header">
126                             <img src="@Url.Content("/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/dist/img/avatar04.png")" class="img-circle" alt="User Image">
127                             <p>
128                                 管理员 - Web Developer
129                                 <small>Member since 2015.8.20</small>
130                             </p>
131                         </li>
132                         <!-- Menu Body -->
133                         <li class="user-body">
134                             <div class="col-xs-4 text-center">
135                                 <a href="#">Followers</a>
136                             </div>
137                             <div class="col-xs-4 text-center">
138                                 <a href="#">Sales</a>
139                             </div>
140                             <div class="col-xs-4 text-center">
141                                 <a href="#">Friends</a>
142                             </div>
143                         </li>
144                         <!-- Menu Footer-->
145                         <li class="user-footer">
146                             <div class="pull-left">
147                                 <a href="#" class="btn btn-default btn-flat">个人信息</a>
148                             </div>
149                             <div class="pull-right">
150                                 <a href="@Url.Action("Logout", "Login", new { Area="Common"})" class="btn btn-default btn-flat">退出</a>
151                             </div>
152                         </li>
153                     </ul>
154                 </li>
155 
156             </ul>
157         </div>
158     </nav>
159 </header>
View Code

头部是要是导航栏里面的东西包括用户退出功能也在这里.

菜单

接下来是菜单,菜单我还没有设计数据库,会在接下来的章节说明.先写死:

 1 @model JCmsErp.Web.Areas.Common.Models.MeunViewModel
 2 @{
 3     Layout = null;
 4 }
 5 
 6 
 7 <aside class="main-sidebar">
 8     <!-- sidebar: style can be found in sidebar.less -->
 9     <section class="sidebar">
10         <!-- Sidebar user panel (optional) -->
11         <div class="user-panel">
12             <div class="pull-left image">
13                 <img src="~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/dist/img/user2-160x160.jpg" class="img-circle" alt="User Image">
14             </div>
15             <div class="pull-left info">
16                 <p>Alexander Pierce</p>
17                 <!-- Status -->
18                 <a href="#"><i class="fa fa-circle text-success"></i> Online</a>
19             </div>
20         </div>
21         <!-- search form (Optional) -->
22         <form action="#" method="get" class="sidebar-form">
23             <div class="input-group">
24                 <input type="text" name="q" class="form-control" placeholder="Search...">
25                 <span class="input-group-btn">
26                     <button type="submit" name="search" id="search-btn" class="btn btn-flat">
27                         <i class="fa fa-search"></i>
28                     </button>
29                 </span>
30             </div>
31         </form>
32         <!-- /.search form -->
33         <!-- Sidebar Menu -->
34         <ul class="sidebar-menu">
35             <li class="header">HEADER</li>
36             <!-- Optionally, you can add icons to the links -->
37             <li class="active"><a href="/User/Index"><i class="fa fa-link"></i><i class="fa fa-windows"></i>  <span>用户管理</span></a></li>
38                 <li><a href="/WorkFlow/Index"><i class="fa fa-link"></i><i class="fa fa-windows"></i>  <span>职位管理</span></a></li>
39                 <li><a href="/Member/Role/Index"><i class="fa fa-link"></i><i class="fa fa-windows"></i>  <span>角色管理</span></a></li>
40                 <li class="active"><a href="/Home/Userinfo"><i class="fa fa-windows"></i>  <span>用户详情</span></a></li>
41                 <li class="active"><a href="/Home/UsersList"><i class="fa fa-windows"></i> <span>角色管理</span></a></li>
42                 <li class="active"><a href="/Home/AbpLanguages"><i class="fa fa-windows"></i> <span>会员管理</span></a></li>
43                 <li><a href="/Home/ReadMail"><i class="fa fa-link"></i> <span>邮件管理</span></a></li>
44                 <li><a href="/Home/UserProfile"><i class="fa fa-link"></i> <span>语言管理</span></a></li>
45                 <li><a href="/Home/ChartJS"><i class="fa fa-link"></i> <span>Chart管理</span></a></li>
46                 <li class="treeview">
47                     <a href="/Home/ChartJS">
48                         <i class="fa fa-link"></i> <span>菜单管理</span>
49                         <span class="pull-right-container">
50                             <i class="fa fa-angle-left pull-right"></i>
51                         </span>
52                     </a>
53                     <ul class="treeview-menu">
54                         <li><a href="/Home/ChartJS">Link in level 2</a></li>
55                         <li><a href="/Home/ChartJS">Link in level 2</a></li>
56                     </ul>
57                 </li>
58         </ul>
59         <!-- /.sidebar-menu -->
60     </section>
61     <!-- /.sidebar -->
62 </aside>
View Code

Foot

最后是Foot:

 1 @{
 2     Layout = null;
 3 }
 4 
 5 <footer class="main-footer">
 6     <!-- To the right -->
 7     <div class="pull-right hidden-xs">
 8         Anything you want
 9     </div>
10     <!-- Default to the left -->
11     <strong>Copyright &copy; 2016 <a href="#">Company</a>.</strong> All rights reserved.
12 </footer>
13 <aside class="control-sidebar control-sidebar-dark">
14     <!-- Create the tabs -->
15     <ul class="nav nav-tabs nav-justified control-sidebar-tabs">
16         <li class="active"><a href="#control-sidebar-home-tab" data-toggle="tab"><i class="fa fa-home"></i></a></li>
17         <li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
18     </ul>
19     <!-- Tab panes -->
20     <div class="tab-content">
21         <!-- Home tab content -->
22         <div class="tab-pane active" id="control-sidebar-home-tab">
23             <h3 class="control-sidebar-heading">Recent Activity</h3>
24             <ul class="control-sidebar-menu">
25                 <li>
26                     <a href="javascript:;">
27                         <i class="menu-icon fa fa-birthday-cake bg-red"></i>
28                         <div class="menu-info">
29                             <h4 class="control-sidebar-subheading">Langdon's Birthday</h4>
30                             <p>Will be 23 on April 24th</p>
31                         </div>
32                     </a>
33                 </li>
34             </ul>
35             <!-- /.control-sidebar-menu -->
36             <h3 class="control-sidebar-heading">Tasks Progress</h3>
37             <ul class="control-sidebar-menu">
38                 <li>
39                     <a href="javascript:;">
40                         <h4 class="control-sidebar-subheading">
41                             Custom Template Design
42                             <span class="pull-right-container">
43                                 <span class="label label-danger pull-right">70%</span>
44                             </span>
45                         </h4>
46                         <div class="progress progress-xxs">
47                             <div class="progress-bar progress-bar-danger" style=" 70%"></div>
48                         </div>
49                     </a>
50                 </li>
51             </ul>
52             <!-- /.control-sidebar-menu -->
53         </div>
54         <!-- /.tab-pane -->
55         <!-- Stats tab content -->
56         <div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div>
57         <!-- /.tab-pane -->
58         <!-- Settings tab content -->
59         <div class="tab-pane" id="control-sidebar-settings-tab">
60             <form method="post">
61                 <h3 class="control-sidebar-heading">General Settings</h3>
62                 <div class="form-group">
63                     <label class="control-sidebar-subheading">
64                         Report panel usage
65                         <input type="checkbox" class="pull-right" checked>
66                     </label>
67                     <p>
68                         Some information about this general settings option
69                     </p>
70                 </div>
71                 <!-- /.form-group -->
72             </form>
73         </div>
74         <!-- /.tab-pane -->
75     </div>
76 </aside>
View Code

效果

就这样我们的模板页就做好了,看效果.

 扩展

需要说明一下的是,需要引入bootstrap包和jquery js.至此模板页诞生.

 有人说在_Layout页面东西很多js和css过多,我们需要给他减负,这里首先当然想到的是@Styles.Render()和 @Scripts.Render()了, @Scripts.Render是mvc通用,abp继承mvc自然是支持的.

在页面上可以用@Styles.Render("~/Content/css") 来加载css,首先要在App_Start 里面BundleConfig.cs 文件里面 添加要包含的css文件,BundleConfig就是一个微软新加的 一个打包的配置类,用来Add 各种Bundle.

然后再向ScriptBundle添加js,同时引用到模板页上来.看下代码

 1 using System.Web.Optimization;
 2 
 3 namespace JCmsErp.Web
 4 {
 5     public static class BundleConfig
 6     {
 7         public static void RegisterBundles(BundleCollection bundles)
 8         {
 9             bundles.IgnoreList.Clear();
10 
11             //VENDOR RESOURCES
12 
13             //~/Bundles/App/vendor/css
14             bundles.Add(
15                 new StyleBundle("~/Bundles/App/vendor/css")
16                     .Include("~/Content/themes/base/all.css", new CssRewriteUrlTransform())
17                     .Include("~/Content/bootstrap-cosmo.min.css", new CssRewriteUrlTransform())
18                     .Include("~/Content/toastr.min.css")
19                     .Include("~/Scripts/sweetalert/sweet-alert.css")
20                     .Include("~/Content/flags/famfamfam-flags.css", new CssRewriteUrlTransform())
21                     .Include("~/Content/font-awesome.min.css", new CssRewriteUrlTransform())
22                      .Include("~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/bootstrap/css/bootstrap.css")
23                          .Include("~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/dist/css/ionicons.min.css")
24                          .Include("~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/dist/css/AdminLTE.min.css")
25                          .Include("~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/dist/css/skins/_all-skins.min.css")
26                          .Include("~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/iCheck/flat/blue.css")
27                          .Include("~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/morris/morris.css")
28                          .Include("~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/jvectormap/jquery-jvectormap-1.2.2.css")
29                          .Include("~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/datepicker/datepicker3.css")
30                          .Include("~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/daterangepicker/daterangepicker-bs3.css")
31                          .Include("~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css")
32 
33                 );
34 
35             //~/Bundles/App/vendor/js
36             bundles.Add(
37                 new ScriptBundle("~/Bundles/App/vendor/js")
38                     .Include(
39                         "~/Abp/Framework/scripts/utils/ie10fix.js",
40                         "~/Scripts/json2.min.js",
41 
42                         "~/Scripts/modernizr-2.8.3.js",
43 
44                         "~/Scripts/jquery-2.1.4.min.js",
45                         "~/Scripts/jquery-ui-1.11.4.min.js",
46 
47                         "~/Scripts/bootstrap.min.js",
48 
49                         "~/Scripts/moment-with-locales.min.js",
50                         "~/Scripts/jquery.blockUI.js",
51                         "~/Scripts/toastr.min.js",
52                         "~/Scripts/sweetalert/sweet-alert.min.js",
53                         "~/Scripts/others/spinjs/spin.js",
54                         "~/Scripts/others/spinjs/jquery.spin.js",
55 
56                         "~/Scripts/angular.min.js",
57                         "~/Scripts/angular-animate.min.js",
58                         "~/Scripts/angular-sanitize.min.js",
59                         "~/Scripts/angular-ui-router.min.js",
60                         "~/Scripts/angular-ui/ui-bootstrap.min.js",
61                         "~/Scripts/angular-ui/ui-bootstrap-tpls.min.js",
62                         "~/Scripts/angular-ui/ui-utils.min.js",
63 
64                         "~/Abp/Framework/scripts/abp.js",
65                         "~/Abp/Framework/scripts/libs/abp.jquery.js",
66                         "~/Abp/Framework/scripts/libs/abp.toastr.js",
67                         "~/Abp/Framework/scripts/libs/abp.blockUI.js",
68                         "~/Abp/Framework/scripts/libs/abp.spin.js",
69                         "~/Abp/Framework/scripts/libs/abp.sweet-alert.js",
70                         "~/Abp/Framework/scripts/libs/abp.moment.js",
71                         "~/Abp/Framework/scripts/libs/angularjs/abp.ng.js",
72                         "~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/bootstrap/js/bootstrap.js",
73                         "~/Scripts/AdminLTE-2.1.1/AdminLTE-2.1.1/plugins/jQuery/jQuery-2.1.4.min.js",
74                         "~/Scripts/AdminLTE-2.3.11/AdminLTE-2.3.11/dist/js/app.min.js"
75                     )
76                 );
77 
78             //APPLICATION RESOURCES
79 
80             //~/Bundles/App/Main/css
81             bundles.Add(
82                 new StyleBundle("~/Bundles/App/Main/css")
83                     .IncludeDirectory("~/App/Main", "*.css", true)
84                 );
85 
86             //~/Bundles/App/Main/js
87             bundles.Add(
88                 new ScriptBundle("~/Bundles/App/Main/js")
89                     .IncludeDirectory("~/App/Main", "*.js", true)
90                 );
91         }
92     }
93 }
View Code
 1 @{
 2     Layout = null;
 3 }
 4 
 5 @using System.Web.Optimization
 6 @{
 7     List<JCmsErp.Menu.Menus> sidebarMenuDataList = ViewBag.SidebarMenuModel;
 8 }
 9 <!DOCTYPE html>
10 <html>
11 <head>
12     <meta charset="UTF-8" />
13     <title>AdminLTE 2 | Dashboard</title>
14     <meta http-equiv="X-UA-Compatible" content="IE=edge">
15 
16     <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport' />
17 
18     @Styles.Render("~/Bundles/App/vendor/css")
19     <style type="text/css">
20         body {
21             font-family: verdana,helvetica,arial,sans-serif;
22             padding: 0 !important;
23             margin: 0;
24         }
25         .content {
26           min-height:700px; height:auto!important;
27         }
28     </style>
29 </head>
30 <body class="hold-transition skin-blue sidebar-mini">
31     <div class="wrapper">
32         @Html.Action("_MainHeader", "Layout", new { area = "Common" })
33         @Html.Action("_LeftSideMenus", "Layout", new { area = "Common" })
34         <div class="content-wrapper">
35             @RenderBody()
36         </div>
37         @Html.Action("_MainFooter", "Layout", new { area = "Common" })
38         <div class="control-sidebar-bg"></div>
39     </div>
40     @Scripts.Render("~/Bundles/App/vendor/js")
41 
42 </body>
43 </html>
View Code

就这样模板页,看上去简洁了很多.至此,模板页.

返回总目录:ABP+AdminLTE+Bootstrap Table权限管理系统一期

您的资助是我最大的动力!
金额随意,欢迎来赏!

如果,您认为阅读这篇博客让您有些收获,不妨点击一下右下角的推荐按钮。
如果,您希望更容易地发现我的新博客,不妨点击一下绿色通道的关注我

如果,想给予我更多的鼓励,求打

因为,我的写作热情也离不开您的肯定支持,感谢您的阅读,我是【安与生】!

本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
原文地址:https://www.cnblogs.com/anyushengcms/p/7261822.html