File

src/app/app-root/sys-check-starter/sys-check-starter.component.ts

Implements

OnInit

Metadata

styleUrls ./sys-check-starter.component.css
templateUrl ./sys-check-starter.component.html

Index

Properties
Methods

Constructor

constructor(mds: MainDataService, bs: BackendService, router: Router)
Parameters :
Name Type Optional
mds MainDataService No
bs BackendService No
router Router No

Methods

buttonStartCheck
buttonStartCheck(checkInfo: SysCheckInfo)
Parameters :
Name Type Optional
checkInfo SysCheckInfo No
Returns : void
ngOnInit
ngOnInit()
Returns : void

Properties

checkConfigList
Type : SysCheckInfo[]
Default value : []
loading
Default value : false
Public mds
Type : MainDataService
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { BackendService } from '../../backend.service';
import { MainDataService } from '../../maindata.service';
import { SysCheckInfo } from '../../app.interfaces';

@Component({
  templateUrl: './sys-check-starter.component.html',
  styleUrls: ['./sys-check-starter.component.css']
})
export class SysCheckStarterComponent implements OnInit {
  checkConfigList: SysCheckInfo[] = [];
  loading = false;

  constructor(
    public mds: MainDataService,
    private bs: BackendService,
    private router: Router
  ) { }

  ngOnInit(): void {
    setTimeout(() => {
      this.mds.appSubTitle$.next('System-Check Auswahl');
      this.loading = true;
      this.mds.setSpinnerOn();
      this.bs.getSysCheckInfo().subscribe(myConfigs => {
        if (myConfigs) {
          this.checkConfigList = myConfigs;
        } else {
          this.checkConfigList = [];
        }
        this.loading = false;
        this.mds.setSpinnerOff();
      });
    });
  }

  buttonStartCheck(checkInfo: SysCheckInfo): void {
    this.router.navigate([`/check/${checkInfo.workspaceId}/${checkInfo.name}`]);
  }
}
<div fxLayout="row wrap" fxLayoutAlign="center stretch">
  <mat-card fxFlex="0 2 500px">
    <mat-card-title>{{mds.appTitle$ | async}}</mat-card-title>
    <mat-card-subtitle>{{mds.appSubTitle$ | async}}</mat-card-subtitle>
    <mat-card-content>
      <p>Hier können Sie ermitteln, ob das Computersystem, das Sie gerade benutzen, für
        die hier vorgesehenen Testungen geeignet ist.</p>
      <p *ngIf="loading">
        Bitte warten... Konfiguration wird geladen
      </p>
      <span *ngIf="!loading">
        <p *ngIf="checkConfigList.length === 0">
          Auf diesem Server ist aktuell kein System-Check verfügbar.
        </p>
        <p *ngIf="checkConfigList.length > 1">
          Bitte wählen Sie einen Check aus!
        </p>
        <p *ngIf="checkConfigList.length === 1">
          Bitte klicken Sie auf den Schalter, um den Check zu starten!
        </p>
      </span>
      <div fxLayout="column" fxLayoutGap="10px" *ngIf="checkConfigList?.length > 0">
        <button mat-raised-button color="primary" (click)="buttonStartCheck(c)"
                *ngFor="let c of checkConfigList">
          <div fxLayout="column">
            <p class="check-title">{{c.label}}</p>
            <p class="check-description">{{c.description}}</p>
          </div>
        </button>
      </div>
    </mat-card-content>
    <mat-card-actions>
      <button [routerLink]="['/']" mat-raised-button color="primary"><i class="material-icons">arrow_back</i> zurück zur Startseite</button>
    </mat-card-actions>
  </mat-card>
</div>

./sys-check-starter.component.css

.check-title {
  font-size: 16pt;
  margin-top: 4px;
  margin-bottom: 0;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 130%;
}

.check-description {
  font-size: 9pt;
  margin-top: 8px;
  color: lightgray;
  height: 24px;
  margin-bottom: 18px;
  white-space: normal;
  line-height: 16px;
}
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""