all-render-select

@@ -63,7 +63,7 @@
             <div class="pure-u-1-2 table-module">
                 <h4>Top CMD</h4>
                 <div class="pure-form top-box">
-                    <select name="" id="">
+                    <select name="" id="tcSelect">
                         <option value="5">5分钟</option>
                         <option value="30">30分钟</option>
                         <option value="60">1小时</option>
@@ -90,7 +90,7 @@
              <div class="pure-u-1-2 table-module">
                 <h4>Top 命中率低</h4>
                 <div class="pure-form top-box">
-                    <select name="" id="">
+                    <select name="" id="tmSelect">
                         <option value="5">5分钟</option>
                         <option value="30">30分钟</option>
                         <option value="60">1小时</option>
@@ -110,7 +110,7 @@
                             <th>Year</th>
                         </tr>
                     </thead>
-                    <tbody id="tkTbody"></tbody>
+                    <tbody id="tmTbody"></tbody>
                     </table>
                 </div>
             </div>

@@ -14,7 +14,7 @@ import cpData from '../data/cp';
 import topSelectHbs from '../hbs/top-select.hbs';
 import rosTbody from '../hbs/ros-tbody.hbs';
 import tcTBodyHbs from '../hbs/tc-tbody.hbs';
-import tkTbodyHbs from '../hbs/hbstk-tbody.hbs';
+import tmTbodyHbs from '../hbs/tm-tbody.hbs';
 
 class RedisLive extends Page {
     constructor() {
@@ -25,7 +25,7 @@ class RedisLive extends Page {
         this.cp; // 命令总数
         this.mc; // 全集群读写并发
         this.tc; // Top CMD
-        this.tk; // Top Key
+        this.tm; // Top Key
      
 
         /* 数据存储 */
@@ -37,23 +37,29 @@ class RedisLive extends Page {
             mc: $('#mc')[0],
             cp: $('#cp')[0],
             tc: $('#tc')[0],
-            tk: $('#tk')[0],
+            tm: $('#tm')[0],
             cloudSelect: $('#cloudSelect'),
             clusterSelect: $('#clusterSelect'),
             cpSelect: $('#cpSelect'),
             mcSelect: $('#mcSelect'),
+            tcSelect: $('#tcSelect'),
+            tmSelect: $('#tmSelect'),
             rosSelect: $('#rosSelect'),
             rosTbody: $('#rosTbody')
         };
 
-        this.cpSelectVal;
-        this.mcSelectVal;
+        this.cpLastTime;
+        this.mcLastTime;
+        this.tcLastTime = 5;
+        this.tmLastTime = 5;
         this.rosSelectVal = 5;
 
         this.selector.cloudSelect.on('change', this.cloudSelectChange.bind(this));
         this.selector.clusterSelect.on('change', this.clusterSelectChange.bind(this));
         this.selector.cpSelect.on('change', this.cpRender.bind(this, true));
         this.selector.mcSelect.on('change', this.mcRender.bind(this, true));
+        this.selector.tcSelect.on('change', this.tcRender.bind(this, true));
+        this.selector.tmSelect.on('change', this.tmRender.bind(this, true));
         this.selector.rosSelect.on('change', this.rosRender.bind(this, true));
 
         this.init();
@@ -96,7 +102,7 @@ class RedisLive extends Page {
         let option = {};
 
         this.cp = echarts.init(this.selector.cp);
-        this.cpSelectVal = this.selector.cpSelect.val();
+        this.cpLastTime = this.selector.cpSelect.val();
 
         let resData = await this.getCommandProcessed();
 
@@ -123,7 +129,7 @@ class RedisLive extends Page {
         let option = {};
 
         this.mc = echarts.init(this.selector.mc);
-        this.mcSelectVal = this.selector.mcSelect.val();
+        this.mcLastTime = this.selector.mcSelect.val();
 
         let resData = await this.getWriteReadProcessed();
 
@@ -151,7 +157,11 @@ class RedisLive extends Page {
     /**
      * Top CMD
      */
-    async tcRender() {
+    async tcRender(refresh) {
+        if (refresh) {
+            this.tcLastTime = this.selector.tcSelect.val();
+        }
+
         let resData = await this.getTopCommandTotal();
         let tcTbody = tcTBodyHbs();
 
@@ -161,11 +171,15 @@ class RedisLive extends Page {
     /**
      * Top 命中率低
      */
-    async tkRender() {
+    async tmRender(refresh) {
+        if (refresh) {
+            this.tmLastTime = this.selector.tmSelect.val();
+        }
+
         let resData = await this.getTopMissRate();
-        let tkTbody = tkTbodyHbs();
+        let tmTbody = tmTbodyHbs();
 
-        this.selector.tkTbody.html(tkTbody);
+        this.selector.tmTbody.html(tmTbody);
     }
 
     async rosRender(refresh) {
@@ -264,7 +278,7 @@ class RedisLive extends Page {
             data: {
                 cloud: this.cloud,
                 redisCluster: this.redisCluster,
-                lastTime: this.cpSelectVal
+                lastTime: this.cpLastTime
             }
         });
     }
@@ -278,7 +292,7 @@ class RedisLive extends Page {
             data: {
                 cloud: this.cloud,
                 redisCluster: this.redisCluster,
-                lastTime: this.mcSelectVal
+                lastTime: this.mcLastTime
             }
         });
     }
@@ -292,7 +306,7 @@ class RedisLive extends Page {
             data: {
                 cloud: this.cloud,
                 redisCluster: this.redisCluster,
-                lastTime: 30
+                lastTime: this.tcLastTime
             }
         });  
     }
@@ -306,7 +320,7 @@ class RedisLive extends Page {
             data: {
                 cloud: this.cloud,
                 redisCluster: this.redisCluster,
-                lastTime: 30
+                lastTime: this.tmLastTime
             }
         });         
     }
@@ -329,6 +343,8 @@ class RedisLive extends Page {
     refreshGraph() {
         this.mcRender(true);
         this.cpRender(true);
+        this.tcRender(true);
+        this.tmRender(true);
         this.rosRender(true);
     }
 }