(五)我的项目性能的实现之用户信息批改
用户批改和增加用户相似,区别在于会把id传回编辑页面并显示用户的Id
BLOG -- 源码目录
└── model -- 数据库操作
├── public -- 动态资源
└── route -- 路由
└── admin --博客治理
├── user-modify.js --用户批改性能路由
└── user-edit.js --用户编辑性能路由
└── admin.js --博客治理页面路由
└── views -- 模板
└── admin --博客治理页面art模板
├── user-edit.art --用户编辑页面
└── user.art --用户列表页
└── app.js -- 创立网站服务
user.art
- 赋值id参数在地址栏来辨别增加和批改/admin/user-edit?id={{@$value._id}}
···
<tbody>
{{each users}}
<tr>
<td>{{@$value._id}}</td>
<td>{{$value.username}}</td>
<td>{{$value.email}}</td>
<td>{{$value.role == 'admin' ? '超级管理员': '普通用户'}}</td>
<td>{{$value.state == 0 ? '启用': '禁用'}}</td>
<td>
<a href="/admin/user-edit?id={{@$value._id}}" class="glyphicon glyphicon-edit"></a>
<i class="glyphicon glyphicon-remove delete" data-toggle="modal" data-target=".confirm-modal" data-id="{{@$value._id}}"></i>
</td>
</tr>
{{/each}}
</tbody>
···
user-edit.js
- 获取地址栏中的id参数,如果存在则是批改操作
- 引入用户的汇合构造函数,依据findOne来查找到这个用户,并将用户的信息渲染到用户的编辑页面
- 辨别表单的提交地址,增加和批改不同的Link,按钮也是
const { User } = require('../../model/user');
module.exports = async (req, res) => {
// 获取到地址栏中的id参数
const { message, id } = req.query;
// 如果以后传递了id参数
if (id) {
// 批改操作
let user = await User.findOne({_id: id});
// 渲染用户编辑页面(批改)
res.render('admin/user-edit', {
message: message,
user: user,
link: '/admin/user-modify?id=' + id,
button: '批改'
});
}else {
// 增加操作
res.render('admin/user-edit', {
message: message,
link: '/admin/user-edit',
button: '增加'
});
}
}
user-edit.art
- 对于用户名增加value值为user.username
- 如果是增加操作的话因为没有渲染user会报错,所以user&&user.username的短路个性来防止出错
- 对于邮箱、角色,状态,进行相似的操作增加value值
- 辨别表单的提交地址,增加和批改不同的Link,按钮也是
- 对于分类题目的Id也依据Button来辨别是否显示用户id
{{extend './common/layout.art'}}
{{block 'main'}}
{{include './common/header.art'}}
<!-- /头部 -->
<!-- 主体内容 -->
<div class="content">
{{include './common/aside.art'}}
<div class="main">
<!-- 分类题目 -->
<div class="title">
<h4 style="display: {{button == '批改' ? 'block' : 'none'}}">{{@user && user._id}}</h4>
<p class="tips">{{message}}</p>
</div>
<!-- /分类题目 -->
<form class="form-container" action="{{link}}" method="post">
<div class="form-group">
<label>用户名</label>
<input name="username" type="text" class="form-control" placeholder="请输出用户名" value="{{user && user.username}}">
</div>
<div class="form-group">
<label>邮箱</label>
<input type="email" class="form-control" placeholder="请输出邮箱地址" name="email" value="{{user && user.email}}">
</div>
<div class="form-group">
<label>明码</label>
<input type="password" class="form-control" placeholder="请输出明码" name="password">
</div>
<div class="form-group">
<label>角色</label>
<select class="form-control" name="role">
<option value="normal" {{user && user.role == 'normal' ? 'selected' : ''}}>普通用户</option>
<option value="admin" {{user && user.role == 'admin' ? 'selected' : ''}}>超级管理员</option>
</select>
</div>
<div class="form-group">
<label>状态</label>
<select class="form-control" name="state">
<option value="0" {{user && user.state == '0' ? 'selected' : ''}}>启用</option>
<option value="1" {{user && user.state == '1' ? 'selected' : ''}}>禁用</option>
</select>
</div>
<div class="buttons">
<input type="submit" class="btn btn-primary" value="{{button}}">
</div>
</form>
</div>
</div>
{{/block}}
admin.js
- 增加用户批改路由
// 援用expess框架
const express = require('express');
// 创立博客展现页面路由
const admin = express.Router();
// 渲染登录页面
admin.get('/login', require('./admin/loginPage'));
// 实现登录性能
admin.post('/login', require('./admin/login'));
// 创立用户列表路由
admin.get('/user', require('./admin/userPage'));
// 实现退出性能
admin.get('/logout', require('./admin/logout'));
// 创立用户编辑页面路由
admin.get('/user-edit', require('./admin/user-edit'));
// 创立实现用户增加性能路由
admin.post('/user-edit', require('./admin/user-edit-fn'));
// 用户批改性能路由
admin.post('/user-modify', require('./admin/user-modify'));
// 将路由对象做为模块成员进行导出
module.exports = admin;
user-modify.js
- 承受客户端传过来的申请参数(post)和要批改的用户的id(get)
- 导入用户汇合构造函数,通过findOne来依据id查问变量的明码
- 明码加密过了所以要导入bcrypt模块,同时通过bcrypt.compare进行明文明码和数据库明码进行比对,返回一个布尔值
- 如果明码比对失败则触发中间件,将页面跳转到user-edit,并呈现提醒的错误信息
- next承受字符串
- 如果比对胜利,则通过UpdateOne来更新批改之后的用户信息,明码是不能批改的所以不能写明码。通过一个const构造而后就不必了反复书写req.body
- 将页面重定向到用户列表页面
const { User } = require('../../model/user');
const bcrypt = require('bcrypt');
module.exports = async (req, res, next) => {
// 接管客户端传递过去的申请参数
const { username, email, role, state, password } = req.body;
// 行将要批改的用户id
const id = req.query.id;
// 依据id查问用户信息
let user = await User.findOne({_id: id});
// 明码比对
const isValid = await bcrypt.compare(password, user.password);
// 明码比对胜利
if (isValid) {
// res.send('明码比对胜利');
// 将用户信息更新到数据库中
await User.updateOne({_id: id}, {
username: username,
email: email,
role: role,
state: state
});
// 将页面重定向到用户列表页面
res.redirect('/admin/user');
}else {
// 明码比对失败
let obj = {path: '/admin/user-edit', message: '明码比对失败,不能进行用户信息的批改', id: id}
next(JSON.stringify(obj));
}
// 明码比对
// res.send(user);
}
app.js
- 对于错误处理的中间件,如果明码比对不胜利,咱们心愿是跳转地址带有?message&和id,这种状况下咱们能够通过遍历和字符串拼接的形式来实现,例如params.push params.join办法
// 援用expess框架
const express = require('express');
// 解决门路
const path = require('path');
// 引入body-parser模块 用来解决post申请参数
const bodyPaser = require('body-parser');
// 导入express-session模块
const session = require('express-session');
// 导入art-tempate模板引擎
const template = require('art-template');
// 创立网站服务器
const app = express();
// 数据库连贯
require('./model/connect');
// 解决post申请参数
app.use(bodyPaser.urlencoded({extended: false}));
// 配置session
app.use(session({
secret: 'secret key',
saveUninitialized: false,
cookie: {
maxAge: 24 * 60 * 60 * 1000
}
}));
// 通知express框架模板所在的地位
app.set('views', path.join(__dirname, 'views'));
// 通知express框架模板的默认后缀是什么
app.set('view engine', 'art');
// 当渲染后缀为art的模板时 所应用的模板引擎是什么
app.engine('art', require('express-art-template'));
// 凋谢动态资源文件
app.use(express.static(path.join(__dirname, 'public')));
// 引入路由模块
const home = require('./route/home');
const admin = require('./route/admin');
// 拦挡申请 判断用户登录状态
app.use('/admin', require('./middleware/loginGuard'));
// 为路由匹配申请门路
app.use('/home', home);
app.use('/admin', admin);
app.use((err, req, res, next) => {
// 将字符串对象转换为对象类型
// JSON.parse()
const result = JSON.parse(err);
// {path: '/admin/user-edit', message: '明码比对失败,不能进行用户信息的批改', id: id}
let params = [];
for (let attr in result) {
if (attr != 'path') {
params.push(attr + '=' + result[attr]);
}
}
res.redirect(`${result.path}?${params.join('&')}`);
})
// 监听端口
app.listen(80);
console.log('网站服务器启动胜利, 请拜访localhost')
发表回复