feat: add setup/welcome page
This commit is contained in:
		
							
								
								
									
										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); | ||||
|     }); | ||||
|   } | ||||
| } | ||||
		Reference in New Issue
	
	Block a user