You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
scrutiny/webapp/frontend/src/app/layout/common/dashboard-settings/dashboard-settings.componen...

104 lines
4.6 KiB

<h2 mat-dialog-title>Scrutiny Settings</h2>
<mat-dialog-content class="mat-typography">
<div class="flex flex-col p-8 pb-0 overflow-hidden">
<div class="flex flex-col mt-5 gt-md:flex-row">
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>Dark Mode</mat-label>
<mat-select [(ngModel)]="theme">
<mat-option value="system">System</mat-option>
<mat-option value="dark">Dark</mat-option>
<mat-option value="light">Light</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="flex flex-col mt-5 gt-md:flex-row">
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>Display Title</mat-label>
<mat-select [(ngModel)]="dashboardDisplay">
<mat-option value="name">Name</mat-option>
<mat-option value="serial_id">Serial ID</mat-option>
<mat-option value="uuid">UUID</mat-option>
<mat-option value="label">Label</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pl-3">
<mat-label>Sort By</mat-label>
<mat-select [(ngModel)]="dashboardSort">
<mat-option value="status">Status</mat-option>
<mat-option value="title">Title</mat-option>
<mat-option value="age">Age</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="flex flex-col mt-5 gt-md:flex-row">
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>Temperature</mat-label>
<mat-select [(ngModel)]="temperatureUnit">
<mat-option value="celsius">Celsius</mat-option>
<mat-option value="fahrenheit">Fahrenheit</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>File Size</mat-label>
<mat-select [(ngModel)]="fileSizeSIUnits">
<mat-option [value]=true>SI Units (GB)</mat-option>
<mat-option [value]=false>Binary Units (GiB)</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="flex flex-col mt-5 gt-md:flex-row">
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>Line stroke</mat-label>
<mat-select [(ngModel)]="lineStroke">
<mat-option value="smooth">Smooth</mat-option>
<mat-option value="straight">Straight</mat-option>
<mat-option value="stepline">Stepline</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="flex flex-col mt-5 gt-md:flex-row">
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>Device Status - Thresholds</mat-label>
<mat-select [(ngModel)]=statusThreshold>
<mat-option [value]=1>Smart</mat-option>
<mat-option [value]=2>Scrutiny</mat-option>
<mat-option [value]=3>Both</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="flex flex-col mt-5 gt-md:flex-row">
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>Notify - Filter Attributes</mat-label>
<mat-select [(ngModel)]=statusFilterAttributes>
<mat-option [value]=0>All</mat-option>
<mat-option [value]=1>Critical</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="flex flex-col mt-5 gt-md:flex-row">
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>Repeat Notifications</mat-label>
<mat-select [(ngModel)]=repeatNotifications>
<mat-option [value]=true>Always</mat-option>
<mat-option [value]=false>Only when the value has changed</mat-option>
</mat-select>
</mat-form-field>
</div>
</div>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close (click)="saveSettings()" cdkFocusInitial>Save</button>
</mat-dialog-actions>