node.js实现图书增删改查-蒲公英云

实现图书的增删改查

1.分析
在这里插入图片描述
2.文件

生成json文件包

F:\others\XAMPP\htdocs\Epr\mybook>npm init -y
Wrote to F:\others\XAMPP\htdocs\Epr\mybook\package.json:

{
“name”: “mybook”,
“version”: “1.0.0”,
“description”: “”,
“main”: “index.js”,
“scripts”: {
```
"test": "echo \"Error: no test specified\" && exit 1"
```
},
“keywords”: [],
“author”: “”,
“license”: “ISC”
}
安装依赖包

F:\others\XAMPP\htdocs\Epr\mybook>cnpm install express art-template body-parser —save
安装模板引擎express-art-template

F:\others\XAMPP\htdocs\Epr\mybook>express art-template
添加文件

在views文件添加index.art文件：
views文件新建：editBook.art，addBook.art

{
{each list}}

{
{/each}}

编号	名称	作者	分类	描述	操作
{ {$value.id}}	{ {$value.name}}	{ {$value.author}}	{ {$value.category}}	{ {$value.desc}}	修改\|删除

addBook添加图书

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>添加图书</title>
    </head>
    <body>
        <div>添加图书</div>
        <form action="/addBook" method="post">
            名称：<input type="text" name="name"><br>
            作者：<input type="text" name="author"><br>
            分类：<input type="text" name="category"><br>
            描述：<input type="text" name="desc"><br>
            <input type="submit" value="提交">
        </form>
    </body>
</html>

editBook修改图书

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>修改图书</title>
</head>
<body>
    <div>修改图书</div>
    <form action="/editBook" method="post">
        <input type="hidden" name="id" value="{
   {id}}">
        名称：<input type="text" name="name" value="{
   {name}}"><br>
        作者：<input type="text" name="author" value="{
   {author}}"><br>
        分类：<input type="text" name="category" value="{
   {category}}"><br>
        描述：<input type="text" name="desc" value="{
   {desc}}"><br>
        <input type="submit" value="提交">
    </form>
</body>
</html>

新建文件夹public：在里面建立style.css

.title {

                text-align: center;
                background-color: lightgreen;
                height: 50px;
                line-height: 50px;
                font-size: 24px;
            }
            .title>a{
                padding-left: 30px;
            }
            .content {
                background-color: lightblue;
            }
            .content table {
                width: 100%;
                text-align: center;
                border-right: 1px solid orange;
                border-bottom: 1px solid orange;
            }
            .content td,th {
                border-left: 1px solid orange;
                border-top: 1px solid orange;
                height: 40px;
                line-height: 40px;
            }

js文件
index.js

/*
图书管理入口文件：
- */
const express = require(‘express’);
const template = require(‘art-template’);
const bodyParser = require(‘body-parser’);
const router = require(‘./router.js’);
const path = require(‘path’);
const app = express();

//启动静态资源服务
app.use('/www', express.static('public'));
//1先使用中间件
//设置模板引擎
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'art');
//使用express兼容art-template模板引擎
app.engine('art', require('express-art-template'));
//3处理请求参数
//3.1
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
//2启动服务器
//2.1配置路由
app.use(router);//app.use() requires a middleware function在router.js导出模块
//2.2监听窗口
app.listen(8079, '127.0.0.1', () => {
    console.log('running');
})

router.js

//路由模块
const express = require('express');
const router = express.Router();
const service =require('./service.js');
//1.加载模块service.js
router.get('/', service.showIndex);
//2.添加图书,跳转到添加图书页面。
router.get('/toAddBook', service.toAddBook);
//3.添加图示：提交表单
router.post('/addBook', service.addBook);
//4.跳转到编辑图书信息页面
router.get('/toEditBook', service.toEditBook);
//5.编辑图书信息提交表单
router.post('/editBook', service.editBook);
//6.删除图书信息
// 删除图书信息
router.get('/deleteBook', service.deleteBook);
//导出:模块
module.exports = router;

service.js

//业务模块:
const data = require('./data.json');
const path = require('path');
const fs = require('fs');
//3.1自动生成图书编号（自增）
let maxBookCode = ()=> {
    let arr = [];
    data.forEach((item) => {
        arr.push(item.id);
    });
    return Math.max.apply(null, arr);
}
let writeDataToFile = (res)=>{
    //把存好的数据写入文件
    fs.writeFile(path.join(__dirname, 'data.json'), JSON.stringify(data, null, 4), (err) => {
        if(err){
            res.send('server error');
        }
        //写入成功后跳转到主页面。
        res.redirect('/');
    });
}
//1.:渲染主页面导出
exports.showIndex = (req, res) => {
    res.render('index', {list: data});//index模板名称
}
//2.跳转到添加图书页面
exports.toAddBook = (req, res) => {
    res.render('addBook', {});
}
//3.添加图书，保存数据
exports.addBook = (req, res) => {
    //获取表单数据
    let info = req.body;
    //把表单数据存放
    let book = {};
    for(let key in info){
        book[key] = info[key];
    }
    book.id = maxBookCode() + 1;
    //把图书信息放到book中
    data.push(book);
    //把存好的数据写入文件
    writeDataToFile(res);
}
//4.跳转到编辑页面
exports.toEditBook = (req, res) => {
    let id = req.query.id;
    let book = null;
    data.forEach((item) => {
        if(id == item.id){
            book = item;
            return;//跳出循环
        }
    });
    res.render('editBook', book);
}
//5.编辑图书，信息数据更新，
exports.editBook = (req, res) => {
    let info = req.body;//获取表单数据。编辑的数据
    //遍历所有数据
    data.forEach((item) => {
        //判断是不是自己编辑的那条数据
        if(info.id == item.id){
            //把信息更新
            for(let key in info){
                item[key] = info[key];//把旧的信息用新的覆盖
            }
            return;
        }
    });
    writeDataToFile(res);
}
//6.删除图书信息
exports.deleteBook = (req, res) => {
    //获取id
    console.log(req.query.body);
    let id = req.query.id;
    data.forEach((item, index) => {
        if(id == item.id){
            //删除数组的一项数据
//            console.log(item.id);
            data.splice(index, 1);//splice() 方法用于添加或删除数组中的元素。
            maxBookCode();
        }
        return;
    });
    writeDataToFile(res);
}