shadowsocks-manager
Version:
A shadowsocks manager tool for multi user and traffic control.
46 lines (45 loc) • 2.58 kB
HTML
<div layout="row" layout-wrap>
<div flex-xs="100" flex-sm="50" flex-md="33" flex-gt-md="25" ng-repeat="server in servers track by server.id">
<md-card ng-click="id === 1 && toServerPage(server.id)">
<md-card-header>
<md-card-header-text layout="row" layout-align="space-between center">
<div layout="column">
<span class="md-title">{{server.name}}<span ng-show="server.status === -1" style="color: #a33;"> 离线</span><span ng-show="server.status !== -1 && !server.isGfw" style="color: #3a3;"> {{server.status}}</span><span ng-show="server.status !== -1 && server.isGfw" style="color: #a33;"> {{server.status}}</span></span>
<span class="md-subhead">{{server.host.split(':')[0]}}:{{server.port}}</span>
</div>
<div>
<md-icon>chevron_right</md-icon>
</div>
</md-card-header-text>
</md-card-header>
<div layout="row" layout-align="center center" ng-if="serverChart.showChart">
<div style="width: 95%; max-width: 500px;">
<canvas class="chart chart-line"
chart-data="server.chart.data"
chart-labels="chart.labels"
chart-series="chart.series"
chart-options="chart.options"
chart-dataset-override="chart.datasetOverride">
</canvas>
</div>
</div>
<md-card-actions layout="row" layout-align="start center" ng-if="serverChart.showChart">
</md-card-actions>
<md-card-content layout="column" ng-if="serverChart.showFlow">
<div layout="row" layout-align="space-between center">
<div translate>本日流量：</div>
<div>{{server.flow.today | flow}}</div>
</div>
<div layout="row" layout-align="space-between center">
<div translate>本周流量：</div>
<div>{{server.flow.week | flow}}</div>
</div>
<div layout="row" layout-align="space-between center">
<div translate>本月流量：</div>
<div>{{server.flow.month | flow}}</div>
</div>
</md-card-content>
</md-card>
</div>
</div>
<div style="height: 100px;"></div>