修改分隔符优化排版

This commit is contained in:
奶爸 2019-12-10 15:49:06 +08:00
parent 9f7f101e7f
commit be57af065d

View File

@ -7,33 +7,19 @@
<div v-for='server in servers' class="card"> <div v-for='server in servers' class="card">
<div class="content"> <div class="content">
<div class="header"><i v-if='server.Host.CountryCode' <div class="header"><i v-if='server.Host.CountryCode'
:class="server.Host.CountryCode + ' flag'"></i> :class="server.Host.CountryCode + ' flag'"></i> @#server.Name#@
<?server.Name?>
<i class="yellow info circle icon"></i> <i class="yellow info circle icon"></i>
<div class='ui content popup'> <div class='ui content popup'>
系统: 系统:@#server.Host.Platform#@-@#server.Host.PlatformVersion#@ [<span
<?server.Host.Platform?>- v-if='server.Host.Virtualization'>@#server.Host.Virtualization#@:</span>@#server.Host.Arch#@]<br>
<?server.Host.PlatformVersion?> [<span v-if='server.Host.Virtualization'> CPU@#server.Host.CPU#@<br>
<?server.Host.Virtualization?>:</span> 硬盘:@#server.State.DiskUsed#@/@#server.State.DiskTotal#@<br>
<?server.Host.Arch?>]<br> 内存:@#server.State.MemUsed#@/@#server.State.MemTotal#@<br>
CPU 交换:@#server.State.SwapUsed#@/@#server.State.SwapTotal#@<br>
<?server.Host.CPU?><br> 流量:<i class='arrow alternate circle down outline icon'></i>@#server.State.NetInTransfer#@ <i
硬盘: class='arrow alternate circle up outline icon'></i>@#server.State.NetOutTransfer#@<br>
<?server.State.DiskUsed?>/ 启动:@#server.Host.BootTime#@<br>
<?server.State.DiskTotal?><br> 版本:@#'v'+server.Host.Version#@<br>
内存:
<?server.State.MemUsed?>/
<?server.State.MemTotal?><br>
交换:
<?server.State.SwapUsed?>/
<?server.State.SwapTotal?><br>
流量:<i class='arrow alternate circle down outline icon'></i>
<?server.State.NetInTransfer?> <i class='arrow alternate circle up outline icon'></i>
<?server.State.NetOutTransfer?><br>
启动:
<?server.Host.BootTime?><br>
版本v
<?server.Host.Version?><br>
</div> </div>
</div> </div>
<div class="description"> <div class="description">
@ -67,9 +53,9 @@
<div class="three wide column">网络</div> <div class="three wide column">网络</div>
<div class="thirteen wide column"> <div class="thirteen wide column">
<i class="arrow alternate circle down outline icon"></i> <i class="arrow alternate circle down outline icon"></i>
<?server.State.NetInSpeed?>/s @#server.State.NetInSpeed#@/s
<i class="arrow alternate circle up outline icon"></i> <i class="arrow alternate circle up outline icon"></i>
<?server.State.NetOutSpeed?>/s @#server.State.NetOutSpeed#@/s
</div> </div>
<div class="three wide column">硬盘</div> <div class="three wide column">硬盘</div>
<div class="thirteen wide column"> <div class="thirteen wide column">
@ -82,8 +68,7 @@
</div> </div>
<div class="three wide column">在线</div> <div class="three wide column">在线</div>
<div class="thirteen wide column"> <div class="thirteen wide column">
<i class="clock icon"></i> <i class="clock icon"></i>@#server.State.Uptime#@
<?server.State.Uptime?>
</div> </div>
</div> </div>
</div> </div>
@ -97,7 +82,7 @@
const servers = {{.Servers }}; const servers = {{.Servers }};
var statusCards = new Vue({ var statusCards = new Vue({
el: 'div.status.cards', el: 'div.status.cards',
delimiters: ['<?', '?>'], delimiters: ['@#', '#@'],
data: { data: {
servers, servers,
}, },