feat: add setup/welcome page
This commit is contained in:
parent
7e7b8b6c8f
commit
d6f51a5d1c
54
src/pages/setup/welcome/welcome.component.html
Normal file
54
src/pages/setup/welcome/welcome.component.html
Normal file
@ -0,0 +1,54 @@
|
|||||||
|
<h1>Установщик MIREA Schedule</h1>
|
||||||
|
<hr/>
|
||||||
|
<p>
|
||||||
|
Мы рады помочь вам начать работу с нашим приложением.
|
||||||
|
Этот мастер настройки проведет вас через ряд шагов по настройке основных параметров вашей системы.
|
||||||
|
К концу этого процесса у вас будет все готово для использования приложения в полной мере.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Пожалуйста, внимательно следуйте инструкциям и предоставьте необходимую информацию при появлении запроса.
|
||||||
|
Если у вас есть какие-либо вопросы, обратитесь к документации или свяжитесь с нашей службой поддержки.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Для получения ключа используете тот же хост, что и Backend приложение и выполните:
|
||||||
|
</p>
|
||||||
|
<code>
|
||||||
|
curl -X 'GET' '{{apiToGetToken}}/Setup/GenerateToken' -H 'accept: application/json'
|
||||||
|
</code>
|
||||||
|
<p>
|
||||||
|
Или
|
||||||
|
</p>
|
||||||
|
<code>
|
||||||
|
Invoke-RestMethod -Uri "{{apiToGetToken}}/Setup/GenerateToken" -Method Get -Headers @{accept="application/json"}
|
||||||
|
</code>
|
||||||
|
|
||||||
|
<div style="display: flex; flex-direction: column; margin: 25px 0;">
|
||||||
|
<mat-form-field color="accent">
|
||||||
|
<mat-label>Токен сервера</mat-label>
|
||||||
|
<input matInput
|
||||||
|
required
|
||||||
|
[formControl]="tokenControl">
|
||||||
|
|
||||||
|
@if (tokenControl.hasError('required')) {
|
||||||
|
<mat-error>
|
||||||
|
Токен является <i>обязательным</i>
|
||||||
|
</mat-error>
|
||||||
|
}
|
||||||
|
|
||||||
|
@if (tokenControl.hasError('pattern')) {
|
||||||
|
<mat-error>
|
||||||
|
Токен должен содержать только BASE64 символы кратные 4 (цирфы, латинские буквы и символы "+/=")
|
||||||
|
</mat-error>
|
||||||
|
}
|
||||||
|
|
||||||
|
@if (tokenControl.hasError('minlength')) {
|
||||||
|
<mat-error>
|
||||||
|
Токен не может быть меньше 16 символов
|
||||||
|
</mat-error>
|
||||||
|
}
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p>Для начала необходимо ввести токен, который нужен для настройки столь важных данных!</p>
|
45
src/pages/setup/welcome/welcome.component.ts
Normal file
45
src/pages/setup/welcome/welcome.component.ts
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
import {Component} from '@angular/core';
|
||||||
|
import {MatButton} from "@angular/material/button";
|
||||||
|
import {NavigationService} from "@service/navigation.service";
|
||||||
|
import {MatFormFieldModule} from "@angular/material/form-field";
|
||||||
|
import {MatInput} from "@angular/material/input";
|
||||||
|
import {AsyncPipe} from "@angular/common";
|
||||||
|
import {FormControl, ReactiveFormsModule, Validators} from "@angular/forms";
|
||||||
|
import SetupService from "@api/v1/setup.service";
|
||||||
|
import {environment} from "@/config/environment";
|
||||||
|
import {AvailableVersion} from "@api/api.service";
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-welcome',
|
||||||
|
standalone: true,
|
||||||
|
imports: [
|
||||||
|
MatButton,
|
||||||
|
MatFormFieldModule,
|
||||||
|
MatInput,
|
||||||
|
AsyncPipe,
|
||||||
|
ReactiveFormsModule
|
||||||
|
],
|
||||||
|
templateUrl: './welcome.component.html'
|
||||||
|
})
|
||||||
|
|
||||||
|
export class WelcomeComponent {
|
||||||
|
protected tokenControl = new FormControl('', [
|
||||||
|
Validators.required,
|
||||||
|
Validators.pattern(/^(?:[A-Za-z0-9+\/]{4})*(?:[A-Za-z0-9+\/]{4}|[A-Za-z0-9+\/]{3}=|[A-Za-z0-9+\/]{2}={2})$/),
|
||||||
|
Validators.minLength(16)
|
||||||
|
]);
|
||||||
|
|
||||||
|
protected apiToGetToken : string = environment.apiUrl;
|
||||||
|
|
||||||
|
constructor(private navigationService: NavigationService, private api: SetupService) {
|
||||||
|
this.apiToGetToken += AvailableVersion[this.api.version];
|
||||||
|
this.navigationService.nextButtonAction = () => {
|
||||||
|
return this.api.checkToken(this.tokenControl.value ?? '');
|
||||||
|
};
|
||||||
|
|
||||||
|
this.navigationService.setNextButtonState(false);
|
||||||
|
this.tokenControl.valueChanges.subscribe(() => {
|
||||||
|
this.navigationService.setNextButtonState(this.tokenControl.valid);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user