106 lines
4.6 KiB
HTML
106 lines
4.6 KiB
HTML
{$layout}
|
||
|
||
<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">»</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" />
|
||
<div class="ui fields inline">
|
||
<div class="ui field">
|
||
<select class="ui dropdown" name="installedState" v-model="installState">
|
||
<option value="0">[安装状态]</option>
|
||
<option value="1">已安装</option>
|
||
<option value="2">未安装</option>
|
||
</select>
|
||
</div>
|
||
<div class="ui field">
|
||
<select class="ui dropdown" name="activeState" v-model="activeState">
|
||
<option value="0">[在线状态]</option>
|
||
<option value="1">在线</option>
|
||
<option value="2">离线</option>
|
||
</select>
|
||
</div>
|
||
<div class="ui field">
|
||
<input type="text" name="keyword" placeholder="节点名称、IP..." :value="keyword" />
|
||
</div>
|
||
<div class="ui field">
|
||
<button class="ui button" type="submit">搜索</button>
|
||
|
||
<a :href="'/httpdns/clusters/cluster?clusterId=' + clusterId"
|
||
v-if="installState > 0 || activeState > 0 || keyword.length > 0">[清除条件]</a>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
|
||
<div class="ui margin" v-if="!hasNodes"></div>
|
||
<p class="comment" v-if="!hasNodes">当前集群下暂时还没有节点。</p>
|
||
|
||
<table class="ui table selectable celled" v-if="hasNodes">
|
||
<thead>
|
||
<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>
|
||
</thead>
|
||
<tbody v-for="node in nodes">
|
||
<tr>
|
||
<td>
|
||
<a
|
||
:href="'/httpdns/clusters/cluster/node?clusterId=' + clusterId + '&nodeId=' + node.id">{{node.name}}</a>
|
||
<a :href="'/httpdns/clusters/cluster/node/update?clusterId=' + clusterId + '&nodeId=' + node.id"
|
||
title="设置"><i class="icon setting grey"></i></a>
|
||
<div v-if="node.region != null">
|
||
<span class="grey small">{{node.region.name}}</span>
|
||
</div>
|
||
</td>
|
||
<td>
|
||
<span v-if="node.ipAddresses.length == 0" class="disabled">-</span>
|
||
<div v-for="addr in node.ipAddresses">
|
||
<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>
|
||
</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>
|
||
</div>
|
||
<div v-else-if="!node.isOn">
|
||
<span class="disabled">未启用</span>
|
||
</div>
|
||
<div v-else>
|
||
<span v-if="node.status.isActive" class="green">在线</span>
|
||
<span v-else class="disabled">离线</span>
|
||
</div>
|
||
</td>
|
||
<td>
|
||
<a :href="'/httpdns/clusters/cluster/node?clusterId=' + clusterId + '&nodeId=' + node.id">详情</a>
|
||
<a href="" @click.prevent="deleteNode(node.id)">删除</a>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<div class="page" v-html="page"></div>
|