demo2基本完成

demo2/myapp/bin/mongodb.js

@@ -38,7 +38,7 @@ mongodb.insert = function(data,callback) {
 
 // 查找数据
 const findOptions={
-  limit:30,//返回最多30条数据
+  limit:10,//返回最多10条数据
   sort:{createdAt:-1}//返回最晚生成的数据
 }
 mongodb.find=function (data,callback) {

demo2/myapp/bin/tcp-client.js

@@ -10,7 +10,8 @@ function init() {
     //定时发送随机数
     let interval = setInterval(()=>{
       if(!client.destroyed){
-        client.write( String(20+Math.random().toFixed(2)*10))
+        let value = (20+Math.random()*10).toFixed(2)
+        client.write(String(value))
       }
       else{
         clearInterval(interval)

demo2/myapp/bin/tcp-server.js

@@ -110,9 +110,22 @@ function findEquipment(id,addr) {
 	return result
 }
 
+// 在列表中找到某个id的设备，结果为数组，可能包含多个socket。
+function findEquipmentById(id) {
+	let result = []
+	let i
+
+	for(i=0;i<equipmentArray.length;i++){
+		if(equipmentArray[i].id === id){
+			result.push(equipmentArray[i])
+		}
+	}
+	return result
+}
+
 // 给设备发送控制命令
-function sentCommand(id,addr,command) {
+function sentCommand(id,command) {
-	let equipments = findEquipment(id,addr)
+	let equipments = findEquipmentById(id)
 	if(equipments.length === 0){
 		return;
 	}

demo2/myapp/public/javascripts/index.js

@@ -1,5 +1,8 @@
 // 获取当前host，用于提供url以建立websocket
 const host = window.location.host
+// 从当前网址里获取设备id ,比如 https://127.0.0.1/equipmentId/789 分析得到设备ID为789，若没有则为123456
+let equipmentId = window.location.pathname.split("/")[2] || "123456"
+
 // 创建websocket连接
 const socket = new WebSocket('ws://'+host);
 // 如果是部署到服务器并配置了SSL证书，应该使用wss协议 
@@ -8,7 +11,7 @@ const socket = new WebSocket('ws://'+host);
 // 如果建立连接
 socket.onopen=()=>{
   console.log("websocket connect!")
-  let data = JSON.stringify({equipmentId:'123456'})
+  let data = JSON.stringify({equipmentId:equipmentId})
   socket.send(data)
 }
 
@@ -19,6 +22,7 @@ socket.onmessage=(msg)=>{
     // 将JSON字符串反转为JSON对象
     let data = JSON.parse(msg.data)
     data.forEach(d => {
+      //将接收到的数据 更新到echart图表里
       updateMyChart(d.time,d.value)
     });
   } catch (error) {
@@ -35,6 +39,15 @@ socket.onerror=(event)=>{
 }
 
 
+//给开关灯按钮添加事件，发起请求 POST /led/:id
+$('#open-led').click(()=>{
+  $.post('/led/'+equipmentId,{action:'open'})
+})
+
+$('#close-led').click(()=>{
+  $.post('/led/'+equipmentId,{action:'close'})
+})
+
 // 基于准备好的dom，初始化echarts实例
 let myChart = echarts.init(document.getElementById('main'));
 
@@ -69,10 +82,19 @@ let option = {
 // 使用刚指定的配置项和数据显示图表。
 myChart.setOption(option);
 
+$.get('/history/'+equipmentId,(data)=>{
+  console.log("history:",data)
+  data.forEach((v)=>{
+    updateMyChart(v.time,v.value)
+  })
+})
+
+
+// 给echart插入新数据
 function updateMyChart(time,value) {
   option.xAxis.data.push(time)
   option.series[0].data.push(value)
-  // 如果数据超过30个，把第一个数据删除。
+  // 如果数据超过10个，把第一个数据删除。
   if(option.xAxis.data.length > 10){
     option.xAxis.data.shift()
     option.series[0].data.shift()

demo2/myapp/routes/index.js

@@ -1,24 +1,49 @@
 var express = require('express');
 var router = express.Router();
-let mongodb = require('../bin/mongodb')
+let mongodb = require('../bin/mongodb');
+let tcpServer = require('../bin/tcp-server.js');
+const moment = require('moment')
 
-/* GET home page. */
+// 默认显示 id为123456的设备
 router.get('/', function(req, res, next) {
-  res.render('index', { title: '软硬结合——demo2' });
+  res.render('index', { title: '智慧宿舍-123456' });
+});
+
+// 显示某设备数据
+// GET /equipmentId/123456
+router.get('/equipmentId/:id', function(req, res, next) {
+  res.render('index', { title: '智慧宿舍-'+req.params.id });
 });
 
 // 获取某设备的历史数据
-// GET /id/123456 取得设备id为12356的数据。
+// GET /history/123456 取得设备id为12356的数据。
-router.get('/id/:id', function(req, res, next) {
+router.get('/history/:id', function(req, res, next) {
   mongodb.find({id:req.params.id},(err,docs)=>{
     if(err){
       res.send(err)
     }
     else{
-      res.send(docs)
+      let result = []
+      docs.forEach( (doc) => {
+        result.push({
+          time:moment(doc.createdAt).format('mm:ss'),
+          value:doc.data
+        })
+      });
+      result.reverse()
+      
+      res.send(result)
     }
     
   })
 });
 
+// 向某设备发送 开/关 LED命令
+router.post('/led/:id',function (req,res,next) {
+  console.log('post /led/:id - ',req.params.id,req.body);
+  tcpServer.sentCommand(req.params.id,req.body.action)
+  res.send({code:0,msg:'命令已发送'})
+})
+
+
 module.exports = router;

demo2/myapp/views/index.pug

@@ -2,7 +2,7 @@ extends layout
 
 block content
   script(src="https://cdn.bootcss.com/echarts/4.2.0-rc.2/echarts.min.js")
-  h1.title(style='font-size:5em;margin-bottom:5vh;') 智能宿舍
+  h1.title(style='font-size:5em;margin-bottom:5vh;')= title
   .container-fluid
     .row
       .col-md-4.col-sm-6
@@ -23,8 +23,8 @@ block content
           img.block-img(src='./images/air-conditioning.png', alt='', style='')
           .content
             .text
-              p.title 实时：
+              p.title 最低：
-              p(style='color:white;') 24 ℃
+              p(style='color:white;') 22 ℃
             .text
               p.title 最高：
               p(style='color:white;') 27 ℃
@@ -52,13 +52,13 @@ block content
           .content
             .text
               p.title 灯管：
-              button.btn.btn-success.btn-lg(type="button") 开启
+              button#open-led.btn.btn-success.btn-lg(type="button") 开启
             .text
-              p.title 空调：
+              p.title 灯管：
-              button.btn.btn-success.btn-lg(type="button") 开启
+              button#close-led.btn.btn-warning.btn-lg(type="button") 关闭
             .text
-              p.title 热水：
+              p.title 门禁：
-              button.btn.btn-warning.btn-lg(type="button") 关闭
+              button.btn.btn-success.btn-lg(type="button") 开启
      
       .col-md-8.col-sm-12
         div#main(style="width: 100%;height:30vh;background-color: rgba(25,118,210,0.3);")

demo2/myapp/views/layout.pug

@@ -1,7 +1,7 @@
 doctype html
 html
   head
-    title= title
+    title= "软硬结合demo2"
     link(rel='stylesheet', href='/stylesheets/style.css')
     script(src='https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js')
     link(href='https://cdn.bootcss.com/twitter-bootstrap/3.4.0/css/bootstrap.min.css', rel='stylesheet')