mirror of
https://github.com/TeaOSLab/EdgeAdmin.git
synced 2025-11-16 21:50:24 +08:00
优化界面显示
This commit is contained in:
@@ -119,6 +119,13 @@ pre:not(.CodeMirror-line) {
|
|||||||
tbody {
|
tbody {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
}
|
}
|
||||||
|
.table-box {
|
||||||
|
margin-top: 1em;
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
.table-box::-webkit-scrollbar {
|
||||||
|
height: 6px;
|
||||||
|
}
|
||||||
.table.width30 {
|
.table.width30 {
|
||||||
width: 30em !important;
|
width: 30em !important;
|
||||||
}
|
}
|
||||||
@@ -128,6 +135,9 @@ tbody {
|
|||||||
.table.width40 {
|
.table.width40 {
|
||||||
width: 40em !important;
|
width: 40em !important;
|
||||||
}
|
}
|
||||||
|
.table.width1024 {
|
||||||
|
width: 1024px !important;
|
||||||
|
}
|
||||||
.table th,
|
.table th,
|
||||||
.table td {
|
.table td {
|
||||||
font-size: 0.9em !important;
|
font-size: 0.9em !important;
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
@@ -45,6 +45,15 @@ tbody {
|
|||||||
background: transparent;
|
background: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.table-box {
|
||||||
|
margin-top: 1em;
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-box::-webkit-scrollbar {
|
||||||
|
height: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
.table.width30 {
|
.table.width30 {
|
||||||
width: 30em !important;
|
width: 30em !important;
|
||||||
}
|
}
|
||||||
@@ -57,6 +66,10 @@ tbody {
|
|||||||
width: 40em !important;
|
width: 40em !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.table.width1024 {
|
||||||
|
width: 1024px !important;
|
||||||
|
}
|
||||||
|
|
||||||
.table th, .table td {
|
.table th, .table td {
|
||||||
font-size: 0.9em !important;
|
font-size: 0.9em !important;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -6,58 +6,64 @@
|
|||||||
|
|
||||||
<p class="comment" v-if="nodes.length == 0">暂时还没有节点。</p>
|
<p class="comment" v-if="nodes.length == 0">暂时还没有节点。</p>
|
||||||
|
|
||||||
<table class="ui table selectable celled" v-if="nodes.length > 0">
|
<div class="table-box">
|
||||||
<thead>
|
<table class="ui table selectable celled" v-if="nodes.length > 0">
|
||||||
<tr>
|
<thead>
|
||||||
<th>节点名称</th>
|
<tr>
|
||||||
<th>GRPC访问地址</th>
|
<th>节点名称</th>
|
||||||
<th>HTTP访问地址</th>
|
<th>GRPC访问地址</th>
|
||||||
<th class="width6 center">版本号</th>
|
<th>HTTP访问地址</th>
|
||||||
<th class="width5 center">CPU</th>
|
<th class="width6 center">版本号</th>
|
||||||
<th class="width5 center">内存</th>
|
<th class="width5 center">CPU</th>
|
||||||
<th class="center width10">状态</th>
|
<th class="width5 center">内存</th>
|
||||||
<th class="two op">操作</th>
|
<th class="center width10">状态</th>
|
||||||
</tr>
|
<th class="two op">操作</th>
|
||||||
</thead>
|
</tr>
|
||||||
<tr v-for="node in nodes">
|
</thead>
|
||||||
<td>{{node.name}}</td>
|
<tr v-for="node in nodes">
|
||||||
<td>
|
<td>{{node.name}}</td>
|
||||||
<div v-if="node.accessAddrs != null && node.accessAddrs.length > 0">
|
<td>
|
||||||
<span class="ui label tiny basic" v-for="addr in node.accessAddrs" style="margin-bottom: 0.5em">{{addr}}</span>
|
<div v-if="node.accessAddrs != null && node.accessAddrs.length > 0">
|
||||||
</div>
|
<div v-for="addr in node.accessAddrs">
|
||||||
<div v-else class="disabled">-</div>
|
<span class="ui label tiny basic" style="margin-bottom: 0.5em">{{addr}}</span>
|
||||||
</td>
|
</div>
|
||||||
<td>
|
</div>
|
||||||
<div v-if="node.restAccessAddrs != null && node.restAccessAddrs.length > 0">
|
<div v-else class="disabled">-</div>
|
||||||
<span class="ui label tiny basic" v-for="addr in node.restAccessAddrs" style="margin-bottom: 0.5em">{{addr}}</span>
|
</td>
|
||||||
</div>
|
<td>
|
||||||
<div v-else class="disabled">-</div>
|
<div v-if="node.restAccessAddrs != null && node.restAccessAddrs.length > 0">
|
||||||
</td>
|
<div v-for="addr in node.restAccessAddrs">
|
||||||
<td class="center">
|
<span class="ui label tiny basic" style="margin-bottom: 0.5em">{{addr}}</span>
|
||||||
<span v-if="node.status.buildVersion.length > 0">v{{node.status.buildVersion}}</span>
|
</div>
|
||||||
<span v-else class="disabled">-</span>
|
</div>
|
||||||
</td>
|
<div v-else class="disabled">-</div>
|
||||||
<td class="center">
|
</td>
|
||||||
<span v-if="node.status.isActive" :class="{red:node.status.cpuUsage > 0.80}">{{node.status.cpuUsageText}}</span>
|
<td class="center">
|
||||||
<span v-else class="disabled">-</span>
|
<span v-if="node.status.buildVersion.length > 0">v{{node.status.buildVersion}}</span>
|
||||||
</td>
|
<span v-else class="disabled">-</span>
|
||||||
<td class="center">
|
</td>
|
||||||
<span v-if="node.status.isActive" :class="{red:node.status.memUsage > 0.80}">{{node.status.memUsageText}}</span>
|
<td class="center">
|
||||||
<span v-else class="disabled">-</span>
|
<span v-if="node.status.isActive" :class="{red:node.status.cpuUsage > 0.80}">{{node.status.cpuUsageText}}</span>
|
||||||
</td>
|
<span v-else class="disabled">-</span>
|
||||||
<td class="center">
|
</td>
|
||||||
<span v-if="!node.isOn"><label-on :v-is-on="node.isOn"></label-on></span>
|
<td class="center">
|
||||||
<div v-else-if="node.status.isActive">
|
<span v-if="node.status.isActive" :class="{red:node.status.memUsage > 0.80}">{{node.status.memUsageText}}</span>
|
||||||
<span class="green">运行中</span>
|
<span v-else class="disabled">-</span>
|
||||||
</div>
|
</td>
|
||||||
<span v-else-if="node.status.updatedAt > 0" class="red">已断开</span>
|
<td class="center">
|
||||||
<span v-else-if="node.status.updatedAt == 0" class="red">未连接</span>
|
<span v-if="!node.isOn"><label-on :v-is-on="node.isOn"></label-on></span>
|
||||||
</td>
|
<div v-else-if="node.status.isActive">
|
||||||
<td>
|
<span class="green">运行中</span>
|
||||||
<a :href="'/api/node?nodeId=' + node.id">详情</a>
|
</div>
|
||||||
<a href="" @click.prevent="deleteNode(node.id)">删除</a>
|
<span v-else-if="node.status.updatedAt > 0" class="red">已断开</span>
|
||||||
</td>
|
<span v-else-if="node.status.updatedAt == 0" class="red">未连接</span>
|
||||||
</tr>
|
</td>
|
||||||
</table>
|
<td>
|
||||||
|
<a :href="'/api/node?nodeId=' + node.id">详情</a>
|
||||||
|
<a href="" @click.prevent="deleteNode(node.id)">删除</a>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="page" v-html="page"></div>
|
<div class="page" v-html="page"></div>
|
||||||
Reference in New Issue
Block a user