add tm data

app.js

@@ -1,5 +1,8 @@
 //app.js
 App({
+  globalData: {
+    plist: []
+  },
   onLaunch: function () {
     console.log('app Launching ...');
   }

app.json

@@ -2,7 +2,8 @@
   "pages":[
     "pages/tm/tm",
     "pages/bb/bb",
-    "pages/douban/douban"
+    "pages/douban/douban",
+    "pages/detail/detail"
   ],
   "tabBar":{
     "borderStyle": "white",

pages/detail/detail.js

@@ -0,0 +1,6 @@
+var app = getApp();
+Page({
+    onLoad: function(opts){
+        console.log('detail:', app.globalData.plist[opts.index]);
+    }
+});

pages/detail/detail.wxml

@@ -0,0 +1,20 @@
+<scroll-view scroll-y="true" style="height:600px" class="container">
+    <view class="m-name">
+        machine name & uptime
+    </view>
+    <view class="m-cpu">
+        cpu data
+    </view>
+    <view class="m-mem">
+        mem data
+    </view>
+    <view class="m-load">
+        loads
+    </view>
+    <view class="m-cores">
+        cores from cpu
+    </view>
+    <view class="m-plist">
+        process - list
+    </view>
+</scroll-view>

pages/tm/tm.js

@@ -1,9 +1,39 @@
 //index.js
 //获取应用实例
+var app = getApp();
 Page({
    data:{
+     plist: []
    },
    onLaunch: function(){
      console.log('index Launching ...');
+   },
+   onShow: function(){
+     var that = this;
+
+     setInterval(function(){
+       that.intervalMonit();
+     }, 1000);
+   },
+   go: function(e){
+     wx.navigateTo({
+       url: '../detail/detail?index=' + e.currentTarget.id
+     });
+   },
+   intervalMonit: function(){
+     var that = this;
+
+     wx.request({
+       url: 'http://localhost:8080',
+       header: {
+         'Content-Type': 'application/json'
+       },
+       success: function(r){
+         app.globalData.plist = r.data;
+          that.setData({
+            plist: r.data
+          });
+       }
+     });
    }
 });

pages/tm/tm.wxml

@@ -1,4 +1,16 @@
 <!--index.wxml-->
 <scroll-view scroll-y="true" class="container">
-
+    <view class="m" wx:for="{{plist}}" bindtap="go" id="{{index}}">
+        <text class="m-name">{{item.sys.hostname}}</text>
+        <view class="m-data">
+            <view class="m-data-left">
+                <text class="m-data-top">{{item.sys.cpus.percent}}</text>
+                <text class="m-data-top">{{item.sys.mem.percent}}</text>
+            </view>
+            <view class="m-data-right">
+                <text class="m-data-top">{{item.sys.load[0]}}, {{item.sys.load[1]}}, {{item.sys.load[2]}}</text>
+                <text class="m-data-top">进程数: {{item.procs.length}}</text>
+            </view>
+        </view>
+    </view>
 </scroll-view>