mirror of
https://github.com/Start9Labs/start-os.git
synced 2026-03-30 20:14:49 +00:00
c782bab296
* switch all fe to camelCase * switch to camelCase on backend --------- Co-authored-by: Aiden McClelland <me@drbonez.dev>
111 lines
3.8 KiB
HTML
111 lines
3.8 KiB
HTML
<ion-header>
|
|
<ion-toolbar>
|
|
<ion-title>System</ion-title>
|
|
<ion-buttons slot="end">
|
|
<badge-menu-button></badge-menu-button>
|
|
</ion-buttons>
|
|
</ion-toolbar>
|
|
</ion-header>
|
|
|
|
<ion-content class="ion-padding with-widgets">
|
|
<!-- loading -->
|
|
<ng-template #loading>
|
|
<text-spinner text="Connecting to server"></text-spinner>
|
|
</ng-template>
|
|
|
|
<!-- loaded -->
|
|
<ion-item-group *ngIf="server$ | async as server; else loading">
|
|
<ion-item
|
|
*ngIf="!server.ntpSynced"
|
|
color="warning"
|
|
class="ion-margin-bottom"
|
|
>
|
|
<ion-icon slot="start" name="warning-outline"></ion-icon>
|
|
<ion-label>
|
|
<h2 style="font-weight: bold">Clock sync failure</h2>
|
|
<p style="font-weight: 600">
|
|
This will cause connectivity issues. Refer to the StartOS docs to
|
|
resolve the issue.
|
|
</p>
|
|
</ion-label>
|
|
<ion-button
|
|
slot="end"
|
|
color="light"
|
|
href="https://docs.start9.com/0.3.5.x/support/common-issues#clock-sync-failure"
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
>
|
|
Open Docs
|
|
<ion-icon slot="end" name="open-outline"></ion-icon>
|
|
</ion-button>
|
|
</ion-item>
|
|
|
|
<div *ngFor="let cat of settings | keyvalue : asIsOrder">
|
|
<ion-item-divider>
|
|
<ion-text color="dark" (click)="addClick(cat.key)">
|
|
{{ cat.key }}
|
|
</ion-text>
|
|
</ion-item-divider>
|
|
<!-- <theme-switcher *ngIf="cat.key === 'Manage'"></theme-switcher> -->
|
|
<ion-item
|
|
*ngFor="let button of cat.value"
|
|
button
|
|
[style.display]="(button.title === 'Repair Disk' && !(showDiskRepair$ | async)) ? 'none' : 'block'"
|
|
[detail]="button.detail"
|
|
[disabled]="button.disabled$ | async"
|
|
(click)="button.action()"
|
|
>
|
|
<ion-icon slot="start" [name]="button.icon"></ion-icon>
|
|
<ion-label>
|
|
<h2>{{ button.title }}</h2>
|
|
<p *ngIf="button.description">{{ button.description }}</p>
|
|
|
|
<!-- "Create Backup" button only -->
|
|
<p *ngIf="button.title === 'Create Backup'">
|
|
<ng-container *ngIf="server.statusInfo as statusInfo">
|
|
<ion-text
|
|
[color]="server.lastBackup | backupColor"
|
|
*ngIf="!statusInfo.backupProgress && !statusInfo.updateProgress"
|
|
>
|
|
Last Backup: {{ server.lastBackup ? (server.lastBackup | date:
|
|
'medium') : 'never' }}
|
|
</ion-text>
|
|
<span *ngIf="!!statusInfo.backupProgress" class="inline">
|
|
<ion-spinner
|
|
color="success"
|
|
style="height: 12px; width: 12px; margin-right: 6px"
|
|
></ion-spinner>
|
|
<ion-text color="success">Backing up</ion-text>
|
|
</span>
|
|
</ng-container>
|
|
</p>
|
|
<!-- "Software Update" button only -->
|
|
<p *ngIf="button.title === 'Software Update'">
|
|
<ion-text
|
|
*ngIf="server.statusInfo.updated; else notUpdated"
|
|
class="inline"
|
|
color="warning"
|
|
>
|
|
Update Complete. Restart to apply changes
|
|
</ion-text>
|
|
<ng-template #notUpdated>
|
|
<ng-container *ngIf="showUpdate$ | async; else check">
|
|
<ion-text class="inline" color="success">
|
|
<ion-icon name="rocket-outline"></ion-icon>
|
|
Update Available
|
|
</ion-text>
|
|
</ng-container>
|
|
<ng-template #check>
|
|
<ion-text class="inline" color="dark">
|
|
<ion-icon name="refresh"></ion-icon>
|
|
Check for updates
|
|
</ion-text>
|
|
</ng-template>
|
|
</ng-template>
|
|
</p>
|
|
</ion-label>
|
|
</ion-item>
|
|
</div>
|
|
</ion-item-group>
|
|
</ion-content>
|