RouterOutlet
- MatListModule
+ FormsModule
+ MatFormField
+ MatInput
+ MatLabel
+ ReactiveFormsModule
+ MatButton
./import-dvd.component.css./import-dvd.component.scss
+ Properties+ |
+
+
|
+
+ Methods+ |
+
| + + | +
constructor()
+constructor(userService: UserService, cobblerApiService: CobblerApiService, _snackBar: MatSnackBar)
| Name | +Type | +Optional | +
| userService | + +
+ UserService
+ |
+
+ + No + | + +
| cobblerApiService | + +
+ CobblerApiService
+ |
+
+ + No + | + +
| _snackBar | + +
+ MatSnackBar
+ |
+
+ + No + | + +
| + + + runImport + + + | +
+runImport()
+ |
+
| + + | +
|
+
+
+ Returns :
+ void
+
+ |
+
| + + + toHTML + + + | +||||||
+toHTML(input: string)
+ |
+ ||||||
| + + | +||||||
|
+
+
+ Parameters :
+
+
+
+ Returns :
+ any
+
+
+
+
+ |
+
| + + + Private + Readonly + _formBuilder + + + | +
+ Default value : inject(FormBuilder)
+ |
+
| + + | +
| + + + Public + userService + + + | +
+ Type : UserService
+
+ |
+
| + + | +
import {Component} from '@angular/core';
-import { MatListModule } from '@angular/material/list';
-import { RouterOutlet } from '@angular/router';
+ import {Component, inject} from '@angular/core';
+import {FormBuilder, FormsModule, ReactiveFormsModule} from '@angular/forms';
+import {MatButton} from '@angular/material/button';
+import {MatFormField, MatLabel} from '@angular/material/form-field';
+import {MatInput} from '@angular/material/input';
+import {MatSnackBar} from '@angular/material/snack-bar';
+import {CobblerApiService, BackgroundImportOptions} from 'cobbler-api';
+import {UserService} from '../../services/user.service';
@Component({
selector: 'cobbler-import-dvd',
templateUrl: './import-dvd.component.html',
- styleUrls: ['./import-dvd.component.css'], standalone: true,
- imports: [RouterOutlet, MatListModule],
+ styleUrls: ['./import-dvd.component.scss'], standalone: true,
+ imports: [
+ FormsModule,
+ MatFormField,
+ MatInput,
+ MatLabel,
+ ReactiveFormsModule,
+ MatButton
+ ],
})
export class ImportDVDComponent {
+ private readonly _formBuilder = inject(FormBuilder);
+ importFormGroup = this._formBuilder.group({
+ path: '',
+ name: '',
+ available_as: '',
+ autoinstall_file: '',
+ rsync_flags: '',
+ arch: '',
+ breed: '',
+ os_version: '',
+ })
+
+ constructor(
+ public userService: UserService,
+ private cobblerApiService: CobblerApiService,
+ private _snackBar: MatSnackBar
+ ) {
+ }
- constructor() {
+ runImport(): void {
+ const importOptions: BackgroundImportOptions = {
+ path: this.importFormGroup.controls.path.value,
+ name: this.importFormGroup.controls.name.value,
+ available_as: this.importFormGroup.controls.available_as.value,
+ autoinstall_file: this.importFormGroup.controls.autoinstall_file.value,
+ rsync_flags: this.importFormGroup.controls.rsync_flags.value,
+ arch: this.importFormGroup.controls.arch.value,
+ breed: this.importFormGroup.controls.breed.value,
+ os_version: this.importFormGroup.controls.os_version.value,
+ };
+ if (this.importFormGroup.invalid) {
+ this._snackBar.open("Please give all inputs a system name!", "Close", {duration: 2000})
+ return;
+ }
+ this.cobblerApiService.background_import(importOptions, this.userService.token).subscribe(
+ value => {
+ // TODO
+ },
+ error => {
+ // HTML encode the error message since it originates from XML
+ this._snackBar.open(this.toHTML(error.message), 'Close');
+ });
+ }
+
+ toHTML(input: string): any {
+ // FIXME: Deduplicate method
+ return new DOMParser().parseFromString(input, 'text/html').documentElement.textContent;
}
}
@@ -235,27 +606,60 @@ Constructor
<div class="right-column" id="dataScreen">
- <router-outlet></router-outlet>
- <div class="ImportDVD-div">
- <h1 class="title">IMPORT DVD</h1>
- <div class="list-group">
- <mat-list>
- <mat-list-item>data 01</mat-list-item>
- <mat-list-item>data 02</mat-list-item>
- <mat-list-item>data 03</mat-list-item>
- </mat-list>
- </div>
- </div>
-</div>
+ <h1 class="title">IMPORT DVD</h1>
+
+<form class="form-replicate" [formGroup]="importFormGroup">
+ <mat-form-field class="form-field-full-width">
+ <mat-label>Path</mat-label>
+ <input matInput type="text" required formControlName="path" placeholder="/mnt/cobbler-mounted/leap-15-4/" />
+ </mat-form-field>
+ <mat-form-field class="form-field-full-width">
+ <mat-label>Name</mat-label>
+ <input matInput type="text" required formControlName="name" placeholder="my-distro" />
+ </mat-form-field>
+ <mat-form-field class="form-field-full-width">
+ <mat-label>Available as</mat-label>
+ <input matInput type="text" formControlName="available_as" placeholder="my-distro" />
+ </mat-form-field>
+ <mat-form-field class="form-field-full-width">
+ <mat-label>Autoinstallation file</mat-label>
+ <input matInput type="text" formControlName="autoinstall_file" placeholder="autoyast.xml" />
+ </mat-form-field>
+ <mat-form-field class="form-field-full-width">
+ <mat-label>rsync flags</mat-label>
+ <input matInput type="text" formControlName="rsync_flags" placeholder="-v" />
+ </mat-form-field>
+ <mat-form-field class="form-field-full-width">
+ <mat-label>Architecture</mat-label>
+ <input matInput type="text" formControlName="arch" placeholder="x86_64" />
+ </mat-form-field>
+ <mat-form-field class="form-field-full-width">
+ <mat-label>Operating System Breed</mat-label>
+ <input matInput type="text" formControlName="breed" placeholder="suse" />
+ </mat-form-field>
+ <mat-form-field class="form-field-full-width">
+ <mat-label>Operating System Version</mat-label>
+ <input matInput type="text" formControlName="os_version" placeholder="15.4" />
+ </mat-form-field>
+ <button mat-button (click)="runImport()">Run</button>
+</form>
- ./import-dvd.component.css
+ ./import-dvd.component.scss
.form-replicate {
+ min-width: 150px;
+ max-width: 600px;
+ width: 100%;
+}
+
+.form-field-full-width {
+ width: 100%;
+}
+