基于bootstrap的订票系统（阶段总结）

做了挺久了。忘了记录了。

用的框架是express，数据库是mysql（navicat可视化操作）。

先是html和服务器的交互，再是服务器和mysql的交互，然后连到一起就行了。

我是找了一些demo，在用的过程中去了解具体的运作方式，由于毕设大限将至，没精力从头学起了。

npm，express，这些安装的时候感觉还是挺麻烦的。

demo里的结构，和其中文件的作用：

conf文件夹里的db.js，MySQL数据库连接配置

      module.exports = {
    mysql: {
        host: 'localhost', 
        user: 'root',
        password: '123456',
        database:'test', // 前面建的user表位于些数据库中
        port: 3306
    }
};

dao文件夹下的userDao.js我的理解是路由发出的命令在这里面执行，去操作数据库。

dao文件夹下的userSqlMapping.js这里是把一些sql语句放在这，在userDao.js里使用

public文件夹下有css，js，images三个文件夹，就是放html的css和js和图片的，在我这里的结构下，运行的时候，引用css直接"css/index.css"就行了。

routes文件夹下的index.js感觉就是路由的作用，指示操作的途径

view文件夹下的是模板，我的html文件是放在这里的。

下面有个流程，流程里为什么会这样的一些原因：

app.js里，

var routes = require('./routes/index');

...

app.use('/', routes);

所以地址里输入localhost:3001是index.js里的路径为“/”的html页面。

app.use(express.static(path.join(__dirname, 'public')));

这段代码使得使用public里的样式或者脚本可以直接css/index.css这个样子

一个简单的流程：

index.js里

		router.get('/', function(req, res, next) {
  			res.render('btn');
		});

那么地址里输入localhost:3001，出现的就是btn.html的页面。里面有个表单

		<form action="/search" method="post" id="first">
			<input type="text" name="start">
			<input type="text" name="end">
			<input type="date" name="date">
			<input type="submit" name="">
		</form>

点击了按钮后，因为action是search，所以执行了index.js里的以下代码

router.post('/search',function(req,res,next){
	if(!req.body) return res.sendStatus(400);
   	userDao.query3(req,res,next);
})

userDao.js文件中

var $sql = require('./userSqlMapping');

...

module.exports = {
   
    query3: function (req, res, next) {
  	var start = req.body.start;//表单里的input，name是start，会跟着表单提交到req中。传的数据很多，这里只是例子，就只用一个了

 	pool.getConnection(function(err, connection) {
            connection.query($sql.query3, start, function(err, result) {
                    res.render('test', { results:result });//数据库操作的结果在result中，传到test.html中
            });
        });
    }
    
};

userSqlMapping.js文件中,start是userDao里传过来的，这里查询的结果会返回到userDao那个result中

var user = {

    query3: 'select * from 车次信息表 where start=?'
};

module.exports = user;

test.html中，这个是模板中的循环，可以把result中的每一条查询信息都在表格中显示出来。

         <tbody> 

         <% results.forEach(function(result){%>
          <form action="/buy" method="get" id="second">
            <tr>
              <td name="no"><%=result.no %></td>
              <td><%=result.startTime %>-<%=result.endTime %></td> 
           <td><%=result.startPlace %>-<%=result.endPlace %></td> 
           <td><%=result.useTime %></td> 
           <td><%=result.price %></td> 
           <td><%=result.left %></td> 
           <td><button οnclick="submitForm()">购买</button></td> 
            </tr>
            </form>
            <% }) %>

         </tbody> 

大概就是这样了。有错误请指出，谢谢