mirror of
https://github.com/Start9Labs/start-os.git
synced 2026-03-30 04:01:58 +00:00
fd354b6cbe
* begin subnav implementation * implement subnav AND angular forms for comparison * unions working-ish, list of enums working * new form approach almost complete * finish new forms approach for action inputs and config * expandable list items and handlebars display * Config animation (#394) * config cammel * config animation Co-authored-by: Drew Ansbacher <drew.ansbacher@spiredigital.com> * improve server settings inputs, still needs work * delete all notifications, styling, and bugs * contracted by default Co-authored-by: Drew Ansbacher <drew.ansbacher@gmail.com> Co-authored-by: Drew Ansbacher <drew.ansbacher@spiredigital.com>
63 lines
2.9 KiB
HTML
63 lines
2.9 KiB
HTML
<ion-content class="subheader-padding">
|
|
|
|
<config-header [spec]="spec" [error]="error"></config-header>
|
|
|
|
<ion-item-group>
|
|
<ion-item-divider>
|
|
<ion-button *ngIf="spec.type === 'string' && spec.copyable" style="padding-right: 12px;" size="small" slot="end" fill="clear" (click)="copy()">
|
|
<ion-icon slot="icon-only" name="copy-outline" size="small"></ion-icon>
|
|
</ion-button>
|
|
</ion-item-divider>
|
|
<!-- string -->
|
|
<ion-item *ngIf="spec.type === 'string'">
|
|
<ion-input [type]="spec.masked && !unmasked ? 'password' : 'text'" placeholder="Enter value" [(ngModel)]="value" (ngModelChange)="handleInput()"></ion-input>
|
|
<div slot="end">
|
|
<ion-button *ngIf="spec.masked" fill="clear" [color]="unmasked ? 'danger' : 'primary'" (click)="toggleMask()">
|
|
<ion-icon slot="icon-only" [name]="unmasked ? 'eye-off-outline' : 'eye-outline'" size="small"></ion-icon>
|
|
</ion-button>
|
|
<ion-button *ngIf="value && spec.nullable" fill="clear" (click)="clear()">
|
|
<ion-icon slot="icon-only" name="close" size="small"></ion-icon>
|
|
</ion-button>
|
|
</div>
|
|
</ion-item>
|
|
<!-- number -->
|
|
<ion-item *ngIf="spec.type === 'number'">
|
|
<ion-input type="tel" placeholder="Enter value" [(ngModel)]="value" (ngModelChange)="handleInput()"></ion-input>
|
|
<span slot="end" *ngIf="spec.units"><ion-text>{{ spec.units }}</ion-text></span>
|
|
<ion-button *ngIf="value && spec.nullable" slot="end" fill="clear" (click)="clear()">
|
|
<ion-icon slot="icon-only" name="close" size="small"></ion-icon>
|
|
</ion-button>
|
|
</ion-item>
|
|
<!-- boolean -->
|
|
<ion-item *ngIf="spec.type === 'boolean'">
|
|
<ion-label>{{ spec.name }}</ion-label>
|
|
<ion-toggle slot="end" [(ngModel)]="value" (ngModelChange)="edited = true"></ion-toggle>
|
|
</ion-item>
|
|
<!-- enum -->
|
|
<ion-list *ngIf="spec.type === 'enum'">
|
|
<ion-radio-group [(ngModel)]="value">
|
|
<ion-item *ngFor="let option of spec.values">
|
|
<ion-label>{{ spec['value-names'][option] }}</ion-label>
|
|
<ion-radio slot="start" [value]="option"></ion-radio>
|
|
</ion-item>
|
|
</ion-radio-group>
|
|
</ion-list>
|
|
<!-- metadata -->
|
|
<div class="ion-padding-start">
|
|
<p *ngIf="spec.type === 'string' && spec['pattern-description']">
|
|
{{ spec['pattern-description'] }}
|
|
</p>
|
|
<p *ngIf="spec.type === 'number' && spec.integral">
|
|
{{ integralDescription }}
|
|
</p>
|
|
<p *ngIf="rangeDescription">
|
|
{{ rangeDescription }}
|
|
</p>
|
|
<ng-container *ngIf="spec.default !== undefined">
|
|
<p>Default: {{ defaultDescription }} <ion-icon style="padding-left: 8px;" name="refresh-outline" color="dark" style="cursor: pointer;" (click)="refreshDefault()"></ion-icon></p>
|
|
<p *ngIf="spec.type === 'number' && spec.units">Units: {{ spec.units }}</p>
|
|
</ng-container>
|
|
</div>
|
|
</ion-item-group>
|
|
|
|
</ion-content> |