前端页面

EdgeAdmin/web/views/@default/httpdns/clusters/cluster.html

@@ -1,10 +1,11 @@
 {$layout}
-{$template "cluster_menu"}
-<div class="ui margin"></div>
 
-<div class="right-menu">
-    <a :href="'/httpdns/clusters/createNode?clusterId=' + clusterId" class="item">[创建节点]</a>
-</div>
+<second-menu>
+    <a class="item" :href="'/httpdns/clusters/cluster?clusterId=' + cluster.id">{{cluster.name}}</a>
+    <span class="item disabled" style="padding-left: 0; padding-right: 0">&raquo;</span>
+    <div class="item"><strong>节点列表</strong></div>
+    <a class="item" :href="'/httpdns/clusters/createNode?clusterId=' + clusterId">创建节点</a>
+</second-menu>
 
 <form class="ui form" action="/httpdns/clusters/cluster">
     <input type="hidden" name="clusterId" :value="clusterId" />
@@ -43,6 +44,9 @@
         <tr>
             <th>节点名称</th>
             <th>IP地址</th>
+            <th class="center">CPU</th>
+            <th class="center">内存</th>
+            <th class="center">负载</th>
             <th class="width-5 center">状态</th>
             <th class="two op">操作</th>
         </tr>
@@ -64,11 +68,21 @@
                     <div class="ui label tiny basic">{{addr.ip}}
                         <span class="small" v-if="addr.name.length > 0">（{{addr.name}}）</span>
                         <span class="small red" v-if="!addr.canAccess" title="不公开访问">[内]</span>
-                        <span class="small red" v-if="!addr.isOn">[下线]</span>
-                        <span class="small red" v-if="!addr.isUp" title="健康检查失败">[宕机]</span>
                     </div>
                 </div>
             </td>
+            <td class="center">
+                <span v-if="node.status != null && node.status.isActive">{{node.status.cpuUsageText}}</span>
+                <span v-else class="disabled">-</span>
+            </td>
+            <td class="center">
+                <span v-if="node.status != null && node.status.isActive">{{node.status.memUsageText}}</span>
+                <span v-else class="disabled">-</span>
+            </td>
+            <td class="center">
+                <span v-if="node.status != null && node.status.isActive && node.status.load1m > 0">{{node.status.load1m}}</span>
+                <span v-else class="disabled">-</span>
+            </td>
             <td class="center">
                 <div v-if="!node.isUp">
                     <span class="red">宕机</span>
@@ -88,4 +102,4 @@
         </tr>
     </tbody>
 </table>
-<div class="page" v-html="page"></div>
+<div class="page" v-html="page"></div>