之前写过一篇，这个所拥有的功能

接下来，针对structure-admin-web的不足，进行了补充，开发了具有登陆的structure-admin项目，技术站：主要是node+vue+redis+MysqL+es6

欢迎访问structure-admin源码：

欢迎访问weekly源码：

项目地址演示地址：

设置的由redis的服务地址host，端口，以及redis的密码，redis的搭建和配置，参考这篇文章。

1.2  在每一次前端请求的路由的时候，都会去redis服务器中去取userInfo的信息

如果为空，返回前端data为空，前端在路由过滤中，跳到登陆页，如果有值就正常返回。 

这个在nodejs的控制器controller里，在每一次前端的请求发送到后端的时候，都会去redis的取userInfo的值，

这个userInfo的值也是自己在登陆的时候，把登陆成功之后的个人信息加入到redis服务中

1.3 在登陆成功的时候讲个人信息加到redis服务中

这个就是将个人信息加入到redis中

WEB 请求中经常通过 session 来维持会话的，框架通过  和 Adapter 来支持 session 功能。

Mysql 的 Adapter 为 ，底层基于  库实现，使用连接池的方式连接数据库，默认连接数为 1。

模型提供了多种方法来查询数据，如:

•  查询单条数据
•  查询多条数据
•  查询总条数
•  分页查询数据
•  查询字段的最大值
•  查询字段的平均值
•  查询字段的最小值
•  对字段值进行求和
•  查询指定字段的值

同时模型支持通过下面的方法指定 sql 语句中的特定条件，如：

•  指定 SQL 语句中的 where 条件
•  /  指定 SQL 语句中的 limit
•  /  指定 SQL 语句中的 field
•  指定 sql 语句中的 order
•  指定 SQL 语句中的 group
•  指定 sql 语句中的 join
•  指定 SQL 语句中的 union
•  指定 sql 语句中的 having
•  设置查询缓存

模型提供了下列的方法来添加数据：

•  添加单条数据
•  where 条件不存在时添加
•  添加多条数据
•  添加子查询的结果数据

模型提供了下列的方法来更新数据：

•  更新单条数据
•  更新多条数据
•  条件式更新
•  字段增加值
•  字段减少值

删除数据

模型提供了下列的方法来删除数据：

•  删除数据

用项目的代码举栗子：

（1）查询单条数据，用find()，条件为：工号（usernum）为180909，用户名（username）为saucxs ，并且填写时间（time）为这周的时间范围的时间戳，返回的是对象object

let weekly = await .model('week''>': startWeekStamp,'<';

解读：model('week')的意思，取得是week的数据表

（2）查询多条数据，用select(),条件：公司id（company_id）为data的数据，返回的是数组array

let department = await .model('department').where({company_id: 'data'});

（3）查询表中的具体的列数据，用field()

departmentMemberList = await .model('user').field('id,company_id,company_name,department_id,department_name,email,role,role_name,username,usernum,telephone').where({ company_id: '>=': .find();

解读：this.user.company_id取的是登陆用户的公司id，{'>=': this.user.role}为比登陆用户的角色

（4）分页查询，用page(page,pagesize)和countSelect()，返回的数据是对象

departmentMemberList = await .model('user').field('id,telephone''>=': "department_id asc,role asc");

解读：返回的对象，如下图所示：（count是总条数，currentPage为当前页，data是数据的数组，pageSize为每一页展示几条，totalPages为总共有多少页）

（5）排序，倒序（desc）和正序(asc)，用order("参数1 asc,参数2 desc”)

departmentMemberList = await .model('user').field('id,role: {'>=': .order("department_id asc,role asc").page(page,pagesize).countSelect();

（6）删除，用delete()，条件用where

await .model('department').where({company_id,department_id}).delete();

（7）新增，用add()，没有where

await .model('department'.add({ company_id: this.user.company_id,company_name: this.user.company_name,department_name });

（8）改，用update()，条件where

await .model('user'.update({ usernum,telephone,department_name });

<h4 id="toc-bf5">手动执行 SQL 语句

有时候模型包装的方法不能满足所有的情况，这时候需要手工指定 SQL 语句，可以通过下面的方法进行：

•  手写 sql 语句查询
•  手写 SQL 语句执行

具体的可以参考thinkJS的官方文档的数据操作这块：

二、前端vue+vuex全局路由守卫，axios请求拦截

刚才简单的说了一下nodejs的后端启动的服务，封装的接口，而前端调用这个接口使用的是url是：模块名/控制器名/方法名，配置文件中修改定义的方法

1、全局路由守卫

全局路由守卫是每一次都会判断是否登陆（也就是判断redis服务中是否有值）。已经登陆（后端返回的用户权限信息），则判断当前要跳转的路由，用户是否有权限访问，可以考虑在用户登陆之后将用户权限把路由过滤一遍生成菜单，菜单保存到vuex中。

=>=Meta.key; key) { store.dispatch("getUserInfo",{}).then(response =>(! (to.path !== '/login' next('/login' (to.path == '/login' next('/writeWeekly'"USER_INFO"

根据这个key来判断是否有权限，取得是路由中Meta的key的值。

'/login''login'Meta: { key: component: login },{ path: '/''home''/writeWeekly''writeWeekly' Meta: { key: '1' }, component: writeWeekly }

2、axios请求拦截

统一处理所有的http请求和响应的，通过配置http request interceptors为http头部增加Authorization字段，其内容为Token，通过配置http response interceptors，当后端接口返回401 Unauthorized（未授权），让用户重新登录。

用户信息 axios.interceptors.request.use(config => (process.env.NODE_ENV === 'development'"username"] = "189090909"axios.interceptors.response.use(
response =><span style="color: #000000;"> {
let data =<span style="color: #000000;"> response.data;
console.log(data,'data'<span style="color: #000000;">);
<span style="color: #0000ff;">if (!<span style="color: #000000;">data.data) {
<span style="color: #008000;">//<span style="color: #008000;"> 登陆成功的回调地址
<span style="color: #0000ff;">return<span style="color: #000000;"> data;
} <span style="color: #0000ff;">else<span style="color: #000000;"> {
<span style="color: #0000ff;">return<span style="color: #000000;"> data;
}
},error =><span style="color: #000000;"> ({
code: -1<span style="color: #000000;">,msg: "网络异常"<span style="color: #000000;">
})
);

对所有的请求进行了封装。

let getConfig ='''X-Requested-With': 'XMLHttpRequest''brackets'5000<span style="color: #008000;">//<span style="color: #008000;"> post请求配置
let postConfig =<span style="color: #000000;"> {
url: ''<span style="color: #000000;">,headers: {
'Content-Type': 'application/json'<span style="color: #000000;">,'X-Requested-With': 'XMLHttpRequest'<span style="color: #000000;">
},transformRequest: [<span style="color: #0000ff;">function<span style="color: #000000;"> (data) {
<span style="color: #0000ff;">return JSON.stringify(data.params ||<span style="color: #000000;"> {})
}],timeout: 5000<span style="color: #000000;">
}

export {
serveUrl,getConfig,postConfig,}

三、项目启动必读

1、首先你的环境是nodejs，不会安装配置参考：

2、clone下来项目

git clone https:

3、分别针对前端vue的的文件夹和node后端，安装相应依赖

npm install

4、安装redis（可以考虑安装RedisDesktopManager）

参考：

5、安装MysqL，这个就不赘述

6、修改nodejs的后端的配置文件adapter.js，config.js这两个文件中

adapter.js

exports.cache ='redis'24 * 60 * 60 * 1000 password: 'a123456' //redis安装时候设置的秘密

exports.model = {  type: 'MysqL',  common: {    logConnect: true,    logsql: true,    logger: msg => think.logger.info(msg)  },  MysqL: {    handle: MysqL,    database: 'weekly',    prefix: 'week_',    encoding: 'utf8',数据库数据库端口数据库的用户名数据库该用户名的密码    dateStrings: true  }};

7、分别对前后端分离的项目启动

(1)前端vue的的启动

npm run dev

(2)和node后端的启动

npm start

8、这样就可以启动

（1）登陆页

（2）写周报页面

40414546.png" alt="">

9、该项目架子搭的周报企业管理系统

在PC端，欢迎访问：，

• （公司负责人）账号：testadmin，密码：123456
• （部门经理）账号：test，密码：123456
• （成员）账号：teststaff，密码：123456