修复，完善

css/index.css

@@ -46,9 +46,10 @@ body {
     opacity: .5
 }
 
-.param-sec input {
+
+/* .param-sec input {
     width: 280px;
-}
+} */
 
 .xunJian-sec input {
     width: 140px;
@@ -64,7 +65,7 @@ body {
     padding: 20px;
     margin-top: 30px;
     width: 100%;
-    height: calc(100vh - 340px);
+    height: calc(100vh - 360px);
     /* height: 100vh; */
     border: 1px solid #000;
     overflow-y: auto;

index.html

@@ -37,45 +37,50 @@
             </div>
             <div class="filter-item">
                 <span>设备ID:</span>
-                <input type="text" placeholder="请输入设备ID">
+                <input type="text" id="deviceId" placeholder="请输入设备ID">
             </div>
-        </div>
 
-        <div class="xunJian-sec">
+            <div class="filter-item">
+                <span>监控编号:</span>
+                <input type="text" id="busAddr" placeholder="请输入监控编号">
+            </div>
+
+            <div class="filter-item">
+                <span>数量:</span>
+                <input type="text" id="count" placeholder="请输入元素数量">
+            </div>
             <div class="filter-item">
                 <span>记录开始序号:</span>
-                <input type="text" placeholder="请输入记录开始序号">
+                <input type="text" id="start" placeholder="请输入记录开始序号">
             </div>
             <div class="filter-item">
                 <span>记录查询数量:</span>
-                <input type="text" placeholder="请输入记录查询数量">
+                <input type="text" id="limit" placeholder="请输入记录查询数量">
+            </div>
+            <div class="filter-item">
+                <span>排序:</span>
+                <input type="text" id="order" placeholder="请输入排序规则">
             </div>
+
             <div class="filter-item">
                 <span>记录时间:</span>
-                <input type="text" placeholder="请输入记录时间">
+                <input type="text" id="time" placeholder="请输入数据采集时间">
             </div>
         </div>
 
         <div class="button-sec">
             <button class="siteCondition">站点工况</button>
             <button class="siteDetail">站点详情</button>
-            <button>设备采集</button>
-            <button>点位数据</button>
-            <button>巡检记录</button>
-            <button>记录数据</button>
+            <button class="getDeviceDetail">设备采集</button>
+            <button class="getPointValue">点位数据</button>
+            <button class="getPatrolRecord">巡检记录</button>
+            <button class="getPatrolDetail">记录数据</button>
         </div>
 
         <div class="data-view">
             <div class="send-status"></div>
-            <!-- <div class="send-time"> -->
-            <!-- [2016-06-17 15:31:21 发出] -->
         </div>
-        <!-- <pre class="send-request">
-            </pre> -->
 
-        <!-- <div class="receive-time"></div> -->
-        <!-- <pre class="receive-request">
-            </pre> -->
     </div>
 
 

js/index.js

@@ -2,7 +2,6 @@
  // 站点工况（websocket实时推送）
  (function() {
 
-
      var websocket;
 
      var isOpen = false;
@@ -55,12 +54,11 @@
              };
 
              websocket.onerror = function(evt) {
-
                  connectError = 1;
                  //  isOpen = true;
                  console.log("Error==:", evt.data);
                  (function() {
-                     alert('连接失败，无效的地址');
+                     alert('无效的地址.');
 
                  })()
 
@@ -95,11 +93,15 @@
      })
 
 
+
+
      //站点工况点击
+
      $('.siteCondition').on('click', function() {
+         var stationId = $('#stationId').val() //站点id
+         var stationName = $('#stationName').val() //站点名称
+
          if (isOpen) {
-             var stationId = $('#stationId').val()
-             var stationName = $('#stationName').val()
              var json = {};
              json.CMD = 'getStationInfo';
              json.StationID = stationId;
@@ -120,8 +122,8 @@
 
      //站点详情点击
      $('.siteDetail').on('click', function() {
+         var stationId = $('#stationId').val() //站点id
          if (isOpen) {
-             var stationId = $('#stationId').val()
              var json = {};
              json.CMD = 'getStationDetail';
              json.StationID = stationId;
@@ -140,4 +142,113 @@
 
      })
 
+
+     //设备采集点击
+     $('.getDeviceDetail').on('click', function() {
+         var stationId = $('#stationId').val() //站点id
+         var deviceId = $('#deviceId').val() //设备Id 
+
+         if (isOpen) {
+             var json = {};
+             json.CMD = 'getDeviceDetail';
+             json.StationID = stationId;
+             json.DeviceID = deviceId;
+
+             //发送时间和请求参数页面渲染
+             $('.data-view').append('<pre class="send-time">[' + time() + '发出]</pre>');
+             $('.data-view').append('<pre class="send-request">' + JSON.stringify(json, null, 2) + '</pre>')
+             scrollBottom();
+             websocket.send(JSON.stringify(json));
+
+         } else {
+             alert('请先打开websocket连接！')
+             return
+
+         }
+     })
+
+
+     //点位数据点击
+     $('.getPointValue').on('click', function() {
+         var stationId = $('#stationId').val() //站点id
+         var deviceId = $('#deviceId').val() //设备Id 
+         var busAddr = $('#busAddr').val() //点位编号
+         var count = $('#count').val() //数量
+
+         if (isOpen) {
+             var json = {};
+             json.CMD = 'getPointValue';
+             json.StationID = stationId;
+             json.DeviceID = deviceId;
+             json.BusAddr = busAddr;
+             json.Count = count;
+
+             //发送时间和请求参数页面渲染
+             $('.data-view').append('<pre class="send-time">[' + time() + '发出]</pre>');
+             $('.data-view').append('<pre class="send-request">' + JSON.stringify(json, null, 2) + '</pre>')
+             scrollBottom();
+             websocket.send(JSON.stringify(json));
+
+         } else {
+             alert('请先打开websocket连接！')
+             return
+
+         }
+     })
+
+
+     //巡检记录
+     $('.getPatrolRecord').on('click', function() {
+         var stationId = $('#stationId').val() //站点id
+         var start = $('#start').val() //起始记录
+         var limit = $('#limit').val() //记录数量
+         var order = $('#order').val() //序号
+
+         if (isOpen) {
+             var json = {};
+             json.CMD = 'getPatrolRecord';
+             json.StationID = stationId;
+             json.Start = start;
+             json.Limit = limit;
+             json.Order = order;
+
+             //发送时间和请求参数页面渲染
+             $('.data-view').append('<pre class="send-time">[' + time() + '发出]</pre>');
+             $('.data-view').append('<pre class="send-request">' + JSON.stringify(json, null, 2) + '</pre>')
+             scrollBottom();
+             websocket.send(JSON.stringify(json));
+
+         } else {
+             alert('请先打开websocket连接！')
+             return
+
+         }
+     })
+
+
+     //记录数据
+     $('.getPatrolDetail').on('click', function() {
+         var stationId = $('#stationId').val() //站点id
+         var times = $('#time').val() //数据采集时间
+
+         if (isOpen) {
+             var json = {};
+             json.CMD = 'getPatrolDetail';
+             json.StationID = stationId;
+             json.Time = times;
+
+             //发送时间和请求参数页面渲染
+             $('.data-view').append('<pre class="send-time">[' + time() + '发出]</pre>');
+             $('.data-view').append('<pre class="send-request">' + JSON.stringify(json, null, 2) + '</pre>')
+             scrollBottom();
+             websocket.send(JSON.stringify(json));
+
+         } else {
+             alert('请先打开websocket连接！')
+             return
+
+         }
+     })
+
+
  })()