|
@@ -0,0 +1,113 @@
|
|
|
+{include file='user/tabler_header.tpl'}
|
|
|
+<div class="page-wrapper">
|
|
|
+ <div class="container-xl">
|
|
|
+ <div class="page-header d-print-none text-white">
|
|
|
+ <div class="row align-items-center">
|
|
|
+ <div class="col">
|
|
|
+ <h2 class="page-title">
|
|
|
+ <span class="home-title">节点列表</span>
|
|
|
+ </h2>
|
|
|
+ <div class="page-pretitle">
|
|
|
+ <span class="home-subtitle">查看节点在线情况</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="page-body">
|
|
|
+ <div class="container-xl">
|
|
|
+ <div class="row row-cards">
|
|
|
+ <div class="col-12">
|
|
|
+ <div class="card">
|
|
|
+ <div class="card-body">
|
|
|
+ <div class="m-0 my-2">
|
|
|
+ 描述中分别表述为:该节点的在线人数,该节点的流量倍率,该节点当月可用流量 / 该节点当月已用流量
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="col-12">
|
|
|
+ <div class="card">
|
|
|
+ <ul class="nav nav-tabs nav-fill" data-bs-toggle="tabs">
|
|
|
+ {foreach $class as $grade}
|
|
|
+ <li class="nav-item">
|
|
|
+ <a href="#class-{$grade['node_class']}"
|
|
|
+ class="nav-link {if $grade['node_class'] == '0'}active{/if}" data-bs-toggle="tab">
|
|
|
+ <i class="ti ti-box-multiple-{$grade['node_class']}"></i>
|
|
|
+ 等级 {$grade['node_class']}
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ {/foreach}
|
|
|
+ </ul>
|
|
|
+ <div class="card-body">
|
|
|
+ <div class="tab-content">
|
|
|
+ {foreach $class as $grade}
|
|
|
+ <div class="tab-pane {if $grade['node_class'] == '0'}active show{/if}"
|
|
|
+ id="class-{$grade['node_class']}">
|
|
|
+ <div class="row row-cards">
|
|
|
+ {foreach $servers as $server}
|
|
|
+ {if $server->node_class == $grade['node_class']}
|
|
|
+ <div class="col-md-3 col-sm-12">
|
|
|
+ <div class="card">
|
|
|
+ <div class="card-body">
|
|
|
+ <div class="row g-3 align-items-center">
|
|
|
+ <div class="col-auto">
|
|
|
+ <span
|
|
|
+ class="status-indicator status-{if ($server->get_node_online_status() == '1')}green{else}red{/if} status-indicator-animated">
|
|
|
+ <span class="status-indicator-circle"></span>
|
|
|
+ <span class="status-indicator-circle"></span>
|
|
|
+ <span class="status-indicator-circle"></span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <div class="col">
|
|
|
+ <h2 class="page-title" style="font-size: 16px;">
|
|
|
+ {$server->name}
|
|
|
+ <span class="card-subtitle my-2"
|
|
|
+ style="font-size: 10px;">
|
|
|
+ {if $server->node_bandwidth_limit == '0'}
|
|
|
+ 不限流量
|
|
|
+ {else}
|
|
|
+ {round($server->node_bandwidth / 1073741824)}
|
|
|
+ GB /
|
|
|
+ {round($server->node_bandwidth_limit / 1073741824)}
|
|
|
+ GB
|
|
|
+ {/if}
|
|
|
+ </span>
|
|
|
+ </h2>
|
|
|
+ <div class="text-muted">
|
|
|
+ <ul class="list-inline list-inline-dots mb-0">
|
|
|
+ {if ($server->get_node_online_status() == '1')}
|
|
|
+ <li class="list-inline-item"><span
|
|
|
+ class="text-green">Up</span></li>
|
|
|
+ {else}
|
|
|
+ <li class="list-inline-item"><span
|
|
|
+ class="text-red">Down</span></li>
|
|
|
+ {/if}
|
|
|
+ <li class="list-inline-item">
|
|
|
+ <i class="ti ti-users"></i>
|
|
|
+ {$server->get_node_online_user_count()}
|
|
|
+ </li>
|
|
|
+ <li class="list-inline-item">
|
|
|
+ <i class="ti ti-rocket"></i>
|
|
|
+ {$server->traffic_rate}x
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ {/if}
|
|
|
+ {/foreach}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ {/foreach}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+{include file='user/tabler_footer.tpl'}
|