源码地址:点击打开链接
管理员登录后点击可以进入管理页面,管理页面位于views/admin文件夹下;
1)当非管理员用户通过url强制进入管理员页面时,需给出对应的提示并阻止其进入;
在views/admin文件夹下新建index.html文件,在routers/admin.js的路由配置中,对于非管理员给出提示,对于管理员则调用模板文件并返回信息
routers/admin.js:
var express = require('express');
var router = express.Router();
router.use(function(req,res,next){
if(!req.userInfo.isAdmin){
res.send('对不起,只有管理员才可以进入后台管理');
}
next();
})
router.get('/',function(req,res,next){
res.render('admin/index',{
userInfo:req.userInfo
});
})
module.exports = router;
2)进入管理员页面之后,提供了对应的展示信息,并将后台返回的userInfo对应信息展示上:
3)当点击后台管理页面上面的不同选项卡时,下面页面应展示不同的信息,可以使用swig的模板功能将头部作为公共部分提取出来,在每个模板页面中引入
在views/admin新建layout.html作为共模板,使用block模板语法引入main欢迎页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" type="text/css" href="/public/css/admin.css">
<script type="text/javascript" src="/public/js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="public/js/admin.js"></script>
</head>
<body>
<div class="a-wrap">
<div>
<ul class="a-header">
<li class="a-item">
<a href="/admin">后台管理</a>
</li>
<li class="a-item">
<a href="">用户管理</a>
</li>
<li class="a-user">
<span>{{userInfo.username}}</span>
<span><a href="">退出</a></span>
</li>
</ul>
</div>
<div class="a-body">
{% block main %}{% endblock %}
</div>
</div>
</body>
</html>
将views/admin/index,html修改为欢迎页面:
{% extends 'layout.html' %}
{% block main %}
<p>你好,<span>{{userInfo.username}}</span></p>
<div>欢迎进后台管理系统</div>
{% endblock %}