express + layui + angular +mysql 构建 后台管理系统

版权声明: https://blog.csdn.net/qq_23521659/article/details/88032975

jade中文文档:http://www.nooong.com/docs/jade_chinese.htm

layui中文文档:https://www.layui.com/doc/element/layout.html

angular1.x : http://www.runoob.com/angularjs/angularjs-tutorial.html

一,jade + angular公用模板

layout.jade

doctype html
html
    head
        title= title
        - var basePath = "http://localhost:3000"
        link(rel='stylesheet', href= basePath + '/thirdParty/layui/css/layui.css')
        link(rel='stylesheet', href= basePath + '/stylesheets/style.css')
        block page_style
    body(ng-app="app").layui-layout-body
        div.layui-body
                block content
    script(src=basePath + '/thirdParty/angular.1.6.9/angular.min.js')
        script(src=basePath + '/thirdParty/layui/layui.js')
        script(type='text/javascript', src=basePath + '/javascripts/main.js')
        block page_script

公用模板的作用在于后期维护十分方便,其他页面只需引用模板即可;

article.jade

extends ../layout

block content
    div(ng-controller="articleController").layui-container
        p #{title}
        table.layui-table
            thead
                tr
                    th 序号
                    th 分类
                    th 标题
                    th 作者
                    th 内容
                    th 状态
                    th 添加时间
                    th 操作
            tbody
                tr(ng-repeat="a in articleList")
                    td(ng-bind="$index+1")
                    td(ng-bind="a.type_name")
                    td(ng-bind="a.article_name")
                    td(ng-bind="a.author")
                    td(ng-bind="a.article_content")
                    td(ng-bind="a.status")
                    td(ng-bind="a.create_time | date:'yyyy-MM-dd'")
                    td(ng-bind="")
        div#paging

block page_script
    script(type='text/javascript', src=basePath + '/javascripts/article.js')

二,集中管理路由

routes/index.js

/**
 * 总的路由控制文件
 *
 * 进行统一的路由分发,这样防止app.js中代码过于臃肿
 *
 * 注: 在对应的加载文件里写 module.exports = router; 否则会报以下错误:
 *
 *  throw new TypeError('Router.use() requires a middleware function but got a ' + gettype(fn))
 *
 * @type {*|createApplication}
 */

var express = require('express');
var router = express.Router();

module.exports = function (app) {

    var home = require('../apis/Article');
    app.use('/', home);

    var usersRouter = require('../routes/users');
    app.use('/users', usersRouter);


    var article = require('../apis/Article');
    app.use('/article',article);

};

app.js

……

// 设置/routes/index文件为总的路由控制文件
// 在routes/index文件中再进行统一的路由分发,这样防止app.js中代码过于臃肿
var routes = require('./routes/index');
routes(app);

……

三,数据库连接

mysql.config.js

// 数据库配置文件
module.exports={
  "host":"127.0.0.1",
  "port":"3306",
  "user":"root",
  "password":"root",
  "database":"test"
}

db.js

//定义数据库query函数,向外暴露
var mysql = require('mysql');
var databaseConfig = require('./mysql.config');  //引入数据库配置模块中的数据

//向外暴露方法
module.exports = {
    query : function(sql,params,callback){
        //每次使用的时候需要创建链接,数据操作完成之后要关闭连接
        var connection = mysql.createConnection(databaseConfig);
        connection.connect(function(err){
            if(err){
                console.log('数据库链接失败');
                throw err;
            }
            //开始数据操作
            connection.query( sql, params, function(err,results,fields ){
                if(err){
                    console.log('数据操作失败');
                    throw err;
                }
                //将查询出来的数据返回给回调函数,这个时候就没有必要使用错误前置的思想了,因为我们在这个文件中已经对错误进行了处理,如果数据检索报错,直接就会阻塞到这个文件中
                callback && callback(results, fields);
                //results作为数据操作后的结果,fields作为数据库连接的一些字段
                //停止链接数据库,必须再查询语句后,要不然一调用这个方法,就直接停止链接,数据操作就会失败
                connection.end(function(err){
                    if(err){
                        console.log('关闭数据库连接失败!');
                        throw err;
                    }
                });
            });
        });
    }
};

使用时统一引用该js即可;

apis/Article.js

var express = require('express');
var db = require('../config/db');
var router = express.Router();
var responseInfo = require('../config/ResponseInfo');

var responseCode = responseInfo.responseCode;
var responseMsg = responseInfo.responseMsg;

router.get('/', function (req, res, next) {
    res.render('./article/article.jade', { title: '文章列表' });
})

router.get('/list',function (req , res , next) {
    var page=req.query.page;
    var limit=req.query.limit;
    var sql_getCount = 'SELECT count(*) as count from article where flag = 1';
    var sql_getList = 'SELECT * from (SELECT * from article WHERE flag = 1 limit ' + (page-1)*limit+','+limit+') A left join article_type B on A.type_id = B.type_id '

    db.query(sql_getCount, function (err, rows, fields) {
        if (err) {
            return;
        }
        db.query(sql_getList,function (list_err,result) {
            if (list_err) {
                console.log(list_err)
                return;
            }
            res.send({
                code:responseCode.TABLE_DATA,
                data:result,
                count:rows[0].count,
                message:responseMsg.SUCCESS_LIST
            });
        })
    })
})

module.exports = router;

后续更新……

猜你喜欢

转载自blog.csdn.net/qq_23521659/article/details/88032975