65 lines
2.1 KiB
HTML
65 lines
2.1 KiB
HTML
<div class="dashboard">
|
|
<div class="header-container" >
|
|
<h2 joyrideStep="titleStep" text="Esta sección muestra el estado general del servidor OgBoot.">OgBoot server Status</h2>
|
|
<button mat-icon-button color="primary" (click)="iniciarTour()">
|
|
<mat-icon>help</mat-icon>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="disk-usage-container">
|
|
<div class="disk-usage" joyrideStep="diskUsageStep" text="Visualiza el uso del disco del servidor.">
|
|
<h3>Uso de disco</h3>
|
|
<ngx-charts-pie-chart
|
|
[view]="view"
|
|
[scheme]="colorScheme"
|
|
[results]="diskUsageChartData"
|
|
[gradient]="gradient"
|
|
[doughnut]="isDoughnut"
|
|
[labels]="showLabels"
|
|
[legend]="showLegend">
|
|
</ngx-charts-pie-chart>
|
|
<div class="disk-usage-info">
|
|
<p>Total: {{ formatBytes(diskUsage.total) }}</p>
|
|
<p>Ocupado: {{ formatBytes(diskUsage.used) }}</p>
|
|
<p>Disponible: {{ formatBytes(diskUsage.available) }}</p>
|
|
<p>Libre: {{ diskUsage.percentage }}%</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="services-status" joyrideStep="servicesStatusStep" text="Aquí puedes ver el estado de los servicios importantes del servidor.">
|
|
<h3>Servicios</h3>
|
|
<ul>
|
|
<li *ngFor="let service of getServices()">
|
|
<span
|
|
class="status-led"
|
|
[ngClass]="{ 'active': service.status === 'active', 'inactive': service.status !== 'active' }"
|
|
></span>
|
|
{{ service.name }}: {{ service.status }}
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="installed-oglives" joyrideStep="oglivesStep" text="Consulta la información de los OGLives instalados en el servidor.">
|
|
<h3>OGLives instalados</h3>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>ID</th>
|
|
<th>Kernel</th>
|
|
<th>Architecture</th>
|
|
<th>Revision</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr *ngFor="let oglive of installedOglives">
|
|
<td>{{ oglive.id }}</td>
|
|
<td>{{ oglive.kernel }}</td>
|
|
<td>{{ oglive.architecture }}</td>
|
|
<td>{{ oglive.revision }}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|