pdnsmanager/frontend/src/app/pages/setup/setup.component.html
2018-04-12 20:05:35 +02:00

89 lines
3.4 KiB
HTML

<div class="row">
<div class="col-12">
<p class="font-weight-bold">Install PDNS Manager</p>
</div>
</div>
<form autocomplete="off" [formGroup]="setupForm" (ngSubmit)="onSubmit()">
<div class="row">
<div class="col-12 col-md-6 col-lg-3" formGroupName="db">
<p class="font-weight-bold">Database</p>
<div class="form-group">
<label>Host</label>
<input type="text" class="form-control auto-invalid" formControlName="host" />
<div class="invalid-feedback">
Host can not be empty.
</div>
</div>
<div class="form-group">
<label>User</label>
<input type="text" class="form-control auto-invalid" formControlName="user" />
<div class="invalid-feedback">
User can not be empty.
</div>
</div>
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control auto-invalid" formControlName="password" />
</div>
<div class="form-group">
<label>Database</label>
<input type="text" class="form-control auto-invalid" formControlName="database" />
<div class="invalid-feedback">
Database can not be empty.
</div>
</div>
<div class="form-group">
<label>Port</label>
<input type="text" class="form-control auto-invalid" formControlName="port" />
<div class="invalid-feedback">
Port must be positive integer.
</div>
</div>
</div>
<div class="col-12 col-md-6 col-lg-3 offset-lg-1" formGroupName="admin">
<p class="font-weight-bold">Initial admin user</p>
<div class="form-group">
<label>Username</label>
<input type="text" class="form-control auto-invalid" formControlName="name" />
<div class="invalid-feedback">
Username can not be empty.
</div>
</div>
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control auto-validstate" formControlName="password" />
<div class="invalid-feedback">
Password can not be empty.
</div>
</div>
<div class="form-group">
<label>Repeat password</label>
<input type="text" class="form-control auto-validstate" formControlName="password2" />
<div class="invalid-feedback">
Passwords do not match.
</div>
</div>
</div>
<div class="col-12 col-md-6 col-lg-3 offset-lg-1">
<app-alert *ngIf="errorMessage">
<app-alert-message>{{ errorMessage }}</app-alert-message>
</app-alert>
</div>
</div>
<div class="row">
<div class="col-12">
<button type="submit" class="btn btn-primary float-right float-md-left" [disabled]="!setupForm.valid || setupForm.pristine">Setup</button>
<app-fa-icon class="ml-3" icon="spinner" size=2 animate="pulse" [hidden]="!loading"></app-fa-icon>
</div>
</div>
</form>