zik/PlayerManagement
1
0
Fork 0
mirror of https://github.com/TomasiDeveloping/PlayerManagement.git synced 2026-04-16 09:12:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

v. 0.9.1

Browse Source
This commit is contained in:
Tomasi - Developing 2025-04-24 09:13:32 +02:00
parent 711fb4adaa
commit b753cc0c68
29 changed files with 159 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
Application/Profiles/CustomEventProfile.cs
View File

@ -12,6 +12,7 @@ public class CustomEventProfile : Profile
.ForMember(des => des.CategoryName, opt => opt.MapFrom(src => src.CustomEventCategory!.Name)); .ForMember(des => des.CategoryName, opt => opt.MapFrom(src => src.CustomEventCategory!.Name));
CreateMap<CustomEvent, CustomEventDetailDto>() CreateMap<CustomEvent, CustomEventDetailDto>()
.ForMember(des => des.CategoryName, opt => opt.MapFrom(src => src.CustomEventCategory!.Name))
.ForMember(des => des.CustomEventParticipants, opt => opt.MapFrom(src => src.CustomEventParticipants)); .ForMember(des => des.CustomEventParticipants, opt => opt.MapFrom(src => src.CustomEventParticipants));
CreateMap<CreateCustomEventDto, CustomEvent>() CreateMap<CreateCustomEventDto, CustomEvent>()

9
README.md
View File

@ -18,6 +18,15 @@ This project is currently in the **Beta Phase**.
--- ---
### **[0.9.1]** - *2025-04-24*
#### ✨ Added
- **Number Formatting Input Mask:** Numbers are now automatically formatted for better readability (e.g., `250000` → `250.000`).
🛠️ **Fixed**
- Fixed an issue where the selected category was not saved correctly when updating a custom event.
---
### **[0.9.0]** - *2025-04-23* ### **[0.9.0]** - *2025-04-23*
#### ✨ Added #### ✨ Added
- **Event Categories:** Custom events can now be assigned to specific categories. - **Event Categories:** Custom events can now be assigned to specific categories.

14
Ui/package-lock.json generated
View File

@ -26,6 +26,7 @@
"bootswatch": "^5.3.3", "bootswatch": "^5.3.3",
"jest-editor-support": "*", "jest-editor-support": "*",
"moment": "^2.30.1", "moment": "^2.30.1",
"ngx-mask": "^19.0.6",
"ngx-pagination": "^6.0.3", "ngx-pagination": "^6.0.3",
"ngx-spinner": "^17.0.0", "ngx-spinner": "^17.0.0",
"ngx-toastr": "^19.0.0", "ngx-toastr": "^19.0.0",
@ -10840,6 +10841,19 @@
"integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==",
"dev": true "dev": true
}, },
"node_modules/ngx-mask": {
"version": "19.0.6",
"resolved": "https://registry.npmjs.org/ngx-mask/-/ngx-mask-19.0.6.tgz",
"integrity": "sha512-lJa3+gIg0XMwjRv71pqW7uYrzFPZXl7VUbdbafJ9uo7QydfHIhUe8ByPgWt5VxvSC2mp5ndE3O7jWMOtv7Kthw==",
"dependencies": {
"tslib": "^2.3.0"
},
"peerDependencies": {
"@angular/common": ">=14.0.0",
"@angular/core": ">=14.0.0",
"@angular/forms": ">=14.0.0"
}
},
"node_modules/ngx-pagination": { "node_modules/ngx-pagination": {
"version": "6.0.3", "version": "6.0.3",
"resolved": "https://registry.npmjs.org/ngx-pagination/-/ngx-pagination-6.0.3.tgz", "resolved": "https://registry.npmjs.org/ngx-pagination/-/ngx-pagination-6.0.3.tgz",

1
Ui/package.json
View File

@ -28,6 +28,7 @@
"bootswatch": "^5.3.3", "bootswatch": "^5.3.3",
"jest-editor-support": "*", "jest-editor-support": "*",
"moment": "^2.30.1", "moment": "^2.30.1",
"ngx-mask": "^19.0.6",
"ngx-pagination": "^6.0.3", "ngx-pagination": "^6.0.3",
"ngx-spinner": "^17.0.0", "ngx-spinner": "^17.0.0",
"ngx-toastr": "^19.0.0", "ngx-toastr": "^19.0.0",

4
Ui/src/app/Authentication/forgot-password/forgot-password.component.html
View File

@ -9,11 +9,11 @@
<form [formGroup]="forgotPasswordForm"> <form [formGroup]="forgotPasswordForm">
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['email'].invalid && (f['email'].dirty || f['email'].touched), 'is-invalid': f['email'].invalid && (f['email'].dirty || !f['email'].untouched),
'is-valid': f['email'].valid}" 'is-valid': f['email'].valid}"
type="email" class="form-control" id="email" placeholder="email" formControlName="email"> type="email" class="form-control" id="email" placeholder="email" formControlName="email">
<label for="email">Email</label> <label for="email">Email</label>
@if (f['email'].invalid && (f['email'].dirty || f['email'].touched)) { @if (f['email'].invalid && (f['email'].dirty || !f['email'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['email'].hasError('required')) { @if (f['email'].hasError('required')) {
<p>Email is required</p> <p>Email is required</p>

8
Ui/src/app/Authentication/login/login.component.html
View File

@ -12,10 +12,10 @@
<!-- Email icon --> <!-- Email icon -->
<i class="input-group-text bi bi-envelope-at-fill"></i> <i class="input-group-text bi bi-envelope-at-fill"></i>
<!-- Email input control with dynamic classes for validation feedback --> <!-- Email input control with dynamic classes for validation feedback -->
<input [ngClass]="{'is-invalid': email?.invalid && (email?.dirty || email?.touched),'is-valid': email?.valid}" <input [ngClass]="{'is-invalid': email?.invalid && (email?.dirty || !email?.untouched),'is-valid': email?.valid}"
class="form-control" formControlName="email" id="email" placeholder="Email Address" type="email"> class="form-control" formControlName="email" id="email" placeholder="Email Address" type="email">
<!-- Email validation messages --> <!-- Email validation messages -->
@if (email?.errors && (email?.dirty || email?.touched)) { @if (email?.errors && (email?.dirty || !email?.untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (email?.hasError('required')) { @if (email?.hasError('required')) {
<p>Email address is required</p> <p>Email address is required</p>
@ -36,7 +36,7 @@
<i class="input-group-text bi bi-key-fill"></i> <i class="input-group-text bi bi-key-fill"></i>
<!-- Password input control with dynamic classes for validation feedback and visibility toggle --> <!-- Password input control with dynamic classes for validation feedback and visibility toggle -->
<input <input
[ngClass]="{'is-invalid': password?.invalid && (password?.dirty || password?.touched),'is-valid': password?.valid}" [ngClass]="{'is-invalid': password?.invalid && (password?.dirty || !password?.untouched),'is-valid': password?.valid}"
[type]="isPasswordType ? 'password' : 'text'" autocomplete="on" class="form-control" [type]="isPasswordType ? 'password' : 'text'" autocomplete="on" class="form-control"
formControlName="password" id="password" placeholder="Password"> formControlName="password" id="password" placeholder="Password">
<!-- Eye icon to toggle password visibility --> <!-- Eye icon to toggle password visibility -->
@ -44,7 +44,7 @@
[ngClass]="isPasswordType ? 'bi bi-eye-fill' : 'bi-eye-slash-fill'" class="input-group-text eye-icon bi"> [ngClass]="isPasswordType ? 'bi bi-eye-fill' : 'bi-eye-slash-fill'" class="input-group-text eye-icon bi">
</i> </i>
<!-- Password validation messages --> <!-- Password validation messages -->
@if (password?.errors && (password?.dirty || password?.touched)) { @if (password?.errors && (password?.dirty || !password?.untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (password?.hasError('required')) { @if (password?.hasError('required')) {
<p>Password is required</p> <p>Password is required</p>

16
Ui/src/app/Authentication/register/register.component.html
View File

@ -42,11 +42,11 @@
<form [formGroup]="registerForm" (ngSubmit)="onSubmit()"> <form [formGroup]="registerForm" (ngSubmit)="onSubmit()">
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched), 'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched),
'is-valid': f['playerName'].valid}" 'is-valid': f['playerName'].valid}"
type="text" class="form-control" id="playerName" placeholder="Player" formControlName="playerName"> type="text" class="form-control" id="playerName" placeholder="Player" formControlName="playerName">
<label for="playerName">Player Name</label> <label for="playerName">Player Name</label>
@if (f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched)) { @if (f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['playerName'].hasError('required')) { @if (f['playerName'].hasError('required')) {
<p>Player name is required</p> <p>Player name is required</p>
@ -57,11 +57,11 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['email'].invalid && (f['email'].dirty || f['email'].touched), 'is-invalid': f['email'].invalid && (f['email'].dirty || !f['email'].untouched),
'is-valid': f['email'].valid}" 'is-valid': f['email'].valid}"
type="email" class="form-control" id="email" placeholder="email" formControlName="email"> type="email" class="form-control" id="email" placeholder="email" formControlName="email">
<label for="email">Email</label> <label for="email">Email</label>
@if (f['email'].invalid && (f['email'].dirty || f['email'].touched)) { @if (f['email'].invalid && (f['email'].dirty || !f['email'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['email'].hasError('required')) { @if (f['email'].hasError('required')) {
<p>Email is required</p> <p>Email is required</p>
@ -77,7 +77,7 @@
<div class="form-floating is-invalid"> <div class="form-floating is-invalid">
<!-- Password Input --> <!-- Password Input -->
<input <input
[ngClass]="{'is-invalid': f['password'].invalid && (f['password'].dirty || f['password'].touched),'is-valid': f['password'].valid}" [ngClass]="{'is-invalid': f['password'].invalid && (f['password'].dirty || !f['password'].untouched),'is-valid': f['password'].valid}"
[type]="isInputText ? 'text' : 'password'" autocomplete="on" class="form-control" [type]="isInputText ? 'text' : 'password'" autocomplete="on" class="form-control"
formControlName="password" formControlName="password"
id="password" placeholder="password"> id="password" placeholder="password">
@ -91,7 +91,7 @@
class="input-group-text eye-icon bi"></i> class="input-group-text eye-icon bi"></i>
</span> </span>
<!-- Password Invalid Feedback --> <!-- Password Invalid Feedback -->
<div *ngIf="f['password'].invalid && (f['password'].dirty || f['password'].touched )" <div *ngIf="f['password'].invalid && (f['password'].dirty || !f['password'].untouched )"
class="invalid-feedback"> class="invalid-feedback">
<p *ngIf="f['password'].hasError('required')">Password is required</p> <p *ngIf="f['password'].hasError('required')">Password is required</p>
<div *ngIf="!f['password'].hasError('required')"> <div *ngIf="!f['password'].hasError('required')">
@ -126,7 +126,7 @@
<div class="form-floating is-invalid mb-3"> <div class="form-floating is-invalid mb-3">
<!-- Confirm Password Input --> <!-- Confirm Password Input -->
<input [ngClass]="{'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched),'is-valid': f['confirmPassword'].valid}" <input [ngClass]="{'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched),'is-valid': f['confirmPassword'].valid}"
type="password" autocomplete="on" class="form-control" type="password" autocomplete="on" class="form-control"
formControlName="confirmPassword" formControlName="confirmPassword"
id="confirmPassword" placeholder="confirmPassword"> id="confirmPassword" placeholder="confirmPassword">
@ -134,7 +134,7 @@
<label for="confirmPassword">Confirm Password</label> <label for="confirmPassword">Confirm Password</label>
</div> </div>
<!-- Confirm Password Invalid Feedback --> <!-- Confirm Password Invalid Feedback -->
<div *ngIf="f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched )" <div *ngIf="f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched )"
class="invalid-feedback"> class="invalid-feedback">
<p *ngIf="f['confirmPassword'].hasError('required')">Confirmation is required</p> <p *ngIf="f['confirmPassword'].hasError('required')">Confirmation is required</p>
<p <p

8
Ui/src/app/Authentication/reset-password/reset-password.component.html
View File

@ -46,12 +46,12 @@
<div class="form-group"> <div class="form-group">
<label class="form-label" for="password">New Password</label> <label class="form-label" for="password">New Password</label>
<div class="input-group"> <div class="input-group">
<input [ngClass]="{ 'is-invalid': password?.invalid && (password?.dirty || password?.touched), 'is-valid': password?.valid}" <input [ngClass]="{ 'is-invalid': password?.invalid && (password?.dirty || !password?.untouched), 'is-valid': password?.valid}"
[type]="isInputText ? 'text' : 'password'" class="form-control" formControlName="password" id="password"> [type]="isInputText ? 'text' : 'password'" class="form-control" formControlName="password" id="password">
<span (click)="isInputText = !isInputText" class="input-group-text eye-icon"> <span (click)="isInputText = !isInputText" class="input-group-text eye-icon">
<i [ngClass]="isInputText ? 'bi-eye-slash-fill' : 'bi-eye-fill'" class="bi"></i> <i [ngClass]="isInputText ? 'bi-eye-slash-fill' : 'bi-eye-fill'" class="bi"></i>
</span> </span>
<div *ngIf="password?.hasError && (password?.dirty || password?.touched)" class="invalid-feedback"> <div *ngIf="password?.hasError && (password?.dirty || !password?.untouched)" class="invalid-feedback">
<p *ngIf="password?.hasError('required')">Password is required</p> <p *ngIf="password?.hasError('required')">Password is required</p>
<div *ngIf="!password?.hasError('required')"> <div *ngIf="!password?.hasError('required')">
<div [ngClass]="password?.hasError('hasNumber') ? 'text-danger': 'text-success'"> <div [ngClass]="password?.hasError('hasNumber') ? 'text-danger': 'text-success'">
@ -84,12 +84,12 @@
<div class="form-group"> <div class="form-group">
<label class="form-label" for="confirmPassword">Confirm Password</label> <label class="form-label" for="confirmPassword">Confirm Password</label>
<div class="input-group"> <div class="input-group">
<input [ngClass]="{'is-invalid': confirmPassword?.invalid && (confirmPassword?.dirty || confirmPassword?.touched), 'is-valid': confirmPassword?.valid}" <input [ngClass]="{'is-invalid': confirmPassword?.invalid && (confirmPassword?.dirty || !confirmPassword?.untouched), 'is-valid': confirmPassword?.valid}"
[type]="isInputText ? 'text' : 'password'" class="form-control" formControlName="confirmPassword" id="confirmPassword"> [type]="isInputText ? 'text' : 'password'" class="form-control" formControlName="confirmPassword" id="confirmPassword">
<span (click)="isInputText = !isInputText" class="input-group-text eye-icon"> <span (click)="isInputText = !isInputText" class="input-group-text eye-icon">
<i [ngClass]="isInputText ? 'bi-eye-slash-fill' : 'bi-eye-fill'" class="bi"></i> <i [ngClass]="isInputText ? 'bi-eye-slash-fill' : 'bi-eye-fill'" class="bi"></i>
</span> </span>
<div *ngIf="confirmPassword?.errors && (confirmPassword?.dirty || confirmPassword?.touched)" class="invalid-feedback"> <div *ngIf="confirmPassword?.errors && (confirmPassword?.dirty || !confirmPassword?.untouched)" class="invalid-feedback">
<p *ngIf="confirmPassword?.hasError('required')">Repeat password is required</p> <p *ngIf="confirmPassword?.hasError('required')">Repeat password is required</p>
<p *ngIf="confirmPassword?.hasError('passwordMismatch')">Passwords do not match</p> <p *ngIf="confirmPassword?.hasError('passwordMismatch')">Passwords do not match</p>
</div> </div>

28
Ui/src/app/Authentication/sign-up/sign-up.component.html
View File

@ -4,11 +4,11 @@
<form [formGroup]="signUpForm" (ngSubmit)="onSignUp()"> <form [formGroup]="signUpForm" (ngSubmit)="onSignUp()">
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched), 'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched),
'is-valid': f['playerName'].valid}" 'is-valid': f['playerName'].valid}"
type="text" class="form-control" id="playerName" placeholder="Player" formControlName="playerName"> type="text" class="form-control" id="playerName" placeholder="Player" formControlName="playerName">
<label for="playerName">Player name</label> <label for="playerName">Player name</label>
@if (f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched)) { @if (f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['playerName'].hasError('required')) { @if (f['playerName'].hasError('required')) {
<p>Player name is required</p> <p>Player name is required</p>
@ -19,11 +19,11 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['email'].invalid && (f['email'].dirty || f['email'].touched), 'is-invalid': f['email'].invalid && (f['email'].dirty || !f['email'].untouched),
'is-valid': f['email'].valid}" 'is-valid': f['email'].valid}"
type="email" class="form-control" id="email" placeholder="email" formControlName="email"> type="email" class="form-control" id="email" placeholder="email" formControlName="email">
<label for="email">Email</label> <label for="email">Email</label>
@if (f['email'].invalid && (f['email'].dirty || f['email'].touched)) { @if (f['email'].invalid && (f['email'].dirty || !f['email'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['email'].hasError('required')) { @if (f['email'].hasError('required')) {
<p>Email is required</p> <p>Email is required</p>
@ -37,11 +37,11 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['allianceServer'].invalid && (f['allianceServer'].dirty || f['allianceServer'].touched), 'is-invalid': f['allianceServer'].invalid && (f['allianceServer'].dirty || !f['allianceServer'].untouched),
'is-valid': f['allianceServer'].valid}" 'is-valid': f['allianceServer'].valid}"
type="number" class="form-control" id="allianceServer" placeholder="allianceServer" formControlName="allianceServer"> type="number" class="form-control" id="allianceServer" placeholder="allianceServer" formControlName="allianceServer">
<label for="allianceServer">Server</label> <label for="allianceServer">Server</label>
@if (f['allianceServer'].invalid && (f['allianceServer'].dirty || f['allianceServer'].touched)) { @if (f['allianceServer'].invalid && (f['allianceServer'].dirty || !f['allianceServer'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['allianceServer'].hasError('required')) { @if (f['allianceServer'].hasError('required')) {
<p>Server is required</p> <p>Server is required</p>
@ -52,11 +52,11 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['allianceName'].invalid && (f['allianceName'].dirty || f['allianceName'].touched), 'is-invalid': f['allianceName'].invalid && (f['allianceName'].dirty || !f['allianceName'].untouched),
'is-valid': f['allianceName'].valid}" 'is-valid': f['allianceName'].valid}"
type="text" class="form-control" id="allianceName" placeholder="allianceName" formControlName="allianceName"> type="text" class="form-control" id="allianceName" placeholder="allianceName" formControlName="allianceName">
<label for="allianceName">Alliance name</label> <label for="allianceName">Alliance name</label>
@if (f['allianceName'].invalid && (f['allianceName'].dirty || f['allianceName'].touched)) { @if (f['allianceName'].invalid && (f['allianceName'].dirty || !f['allianceName'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['allianceName'].hasError('required')) { @if (f['allianceName'].hasError('required')) {
<p>Alliance name is required</p> <p>Alliance name is required</p>
@ -67,11 +67,11 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['allianceAbbreviation'].invalid && (f['allianceAbbreviation'].dirty || f['allianceAbbreviation'].touched), 'is-invalid': f['allianceAbbreviation'].invalid && (f['allianceAbbreviation'].dirty || !f['allianceAbbreviation'].untouched),
'is-valid': f['allianceAbbreviation'].valid}" 'is-valid': f['allianceAbbreviation'].valid}"
type="text" class="form-control" id="allianceAbbreviation" placeholder="allianceAbbreviation" formControlName="allianceAbbreviation"> type="text" class="form-control" id="allianceAbbreviation" placeholder="allianceAbbreviation" formControlName="allianceAbbreviation">
<label for="allianceAbbreviation">Alliance abbreviation</label> <label for="allianceAbbreviation">Alliance abbreviation</label>
@if (f['allianceAbbreviation'].invalid && (f['allianceAbbreviation'].dirty || f['allianceAbbreviation'].touched)) { @if (f['allianceAbbreviation'].invalid && (f['allianceAbbreviation'].dirty || !f['allianceAbbreviation'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['allianceAbbreviation'].hasError('required')) { @if (f['allianceAbbreviation'].hasError('required')) {
<p>Alliance abbreviation is required</p> <p>Alliance abbreviation is required</p>
@ -84,7 +84,7 @@
<div class="form-floating is-invalid"> <div class="form-floating is-invalid">
<!-- Password Input --> <!-- Password Input -->
<input <input
[ngClass]="{'is-invalid': f['password'].invalid && (f['password'].dirty || f['password'].touched),'is-valid': f['password'].valid}" [ngClass]="{'is-invalid': f['password'].invalid && (f['password'].dirty || !f['password'].untouched),'is-valid': f['password'].valid}"
[type]="isInputText ? 'text' : 'password'" autocomplete="on" class="form-control" [type]="isInputText ? 'text' : 'password'" autocomplete="on" class="form-control"
formControlName="password" formControlName="password"
id="password" placeholder="password"> id="password" placeholder="password">
@ -98,7 +98,7 @@
class="input-group-text eye-icon bi"></i> class="input-group-text eye-icon bi"></i>
</span> </span>
<!-- Password Invalid Feedback --> <!-- Password Invalid Feedback -->
<div *ngIf="f['password'].invalid && (f['password'].dirty || f['password'].touched )" <div *ngIf="f['password'].invalid && (f['password'].dirty || !f['password'].untouched )"
class="invalid-feedback"> class="invalid-feedback">
<p *ngIf="f['password'].hasError('required')">Required</p> <p *ngIf="f['password'].hasError('required')">Required</p>
<div *ngIf="!f['password'].hasError('required')"> <div *ngIf="!f['password'].hasError('required')">
@ -133,7 +133,7 @@
<div class="form-floating is-invalid mb-3"> <div class="form-floating is-invalid mb-3">
<!-- Confirm Password Input --> <!-- Confirm Password Input -->
<input [ngClass]="{'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched),'is-valid': f['confirmPassword'].valid}" <input [ngClass]="{'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched),'is-valid': f['confirmPassword'].valid}"
type="password" autocomplete="on" class="form-control" type="password" autocomplete="on" class="form-control"
formControlName="confirmPassword" formControlName="confirmPassword"
id="confirmPassword" placeholder="confirmPassword"> id="confirmPassword" placeholder="confirmPassword">
@ -141,7 +141,7 @@
<label for="confirmPassword">Confirm Password</label> <label for="confirmPassword">Confirm Password</label>
</div> </div>
<!-- Confirm Password Invalid Feedback --> <!-- Confirm Password Invalid Feedback -->
<div *ngIf="f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched )" <div *ngIf="f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched )"
class="invalid-feedback"> class="invalid-feedback">
<p *ngIf="f['confirmPassword'].hasError('required')">Confirmation password is required</p> <p *ngIf="f['confirmPassword'].hasError('required')">Confirmation password is required</p>
<p <p

6
Ui/src/app/app.module.ts
View File

@ -64,6 +64,7 @@ import { ImprintComponent } from './pages/imprint/imprint.component';
import { CustomEventCategoryComponent } from './pages/custom-event/custom-event-category/custom-event-category.component'; import { CustomEventCategoryComponent } from './pages/custom-event/custom-event-category/custom-event-category.component';
import { CustomEventLeaderboardComponent } from './pages/custom-event/custom-event-leaderboard/custom-event-leaderboard.component'; import { CustomEventLeaderboardComponent } from './pages/custom-event/custom-event-leaderboard/custom-event-leaderboard.component';
import { CustomEventEventsComponent } from './pages/custom-event/custom-event-events/custom-event-events.component'; import { CustomEventEventsComponent } from './pages/custom-event/custom-event-events/custom-event-events.component';
import {NgxMaskDirective, NgxMaskPipe, provideNgxMask} from "ngx-mask";
@NgModule({ @NgModule({
declarations: [ declarations: [
@ -137,9 +138,12 @@ import { CustomEventEventsComponent } from './pages/custom-event/custom-event-ev
tokenGetter: () => localStorage.getItem(''), tokenGetter: () => localStorage.getItem(''),
} }
}), }),
AgCharts AgCharts,
NgxMaskDirective,
NgxMaskPipe
], ],
providers: [ providers: [
provideNgxMask(),
provideHttpClient(withInterceptors([spinnerInterceptor, jwtInterceptor])) provideHttpClient(withInterceptors([spinnerInterceptor, jwtInterceptor]))
], ],
bootstrap: [AppComponent] bootstrap: [AppComponent]

5
Ui/src/app/modals/custom-event-participants-model/custom-event-participants-model.component.html
View File

@ -24,15 +24,12 @@
<input [ngClass]="{ <input [ngClass]="{
'is-valid': participant.get('achievedPoints')?.valid, 'is-valid': participant.get('achievedPoints')?.valid,
'is-invalid': participant.get('achievedPoints')?.invalid && (participant.get('achievedPoints')?.touched || participant.get('achievedPoints')?.dirty) 'is-invalid': participant.get('achievedPoints')?.invalid && (participant.get('achievedPoints')?.touched || participant.get('achievedPoints')?.dirty)
}" type="number" min="0" class="form-control form-control-sm" id="point{{i}}" formControlName="achievedPoints"> }" type="text" mask="separator.2" thousandSeparator="." separatorLimit="9999999999999999" class="form-control form-control-sm" id="point{{i}}" formControlName="achievedPoints">
@if (participant.get('achievedPoints')?.invalid && (participant.get('achievedPoints')?.touched || participant.get('achievedPoints')?.dirty)) { @if (participant.get('achievedPoints')?.invalid && (participant.get('achievedPoints')?.touched || participant.get('achievedPoints')?.dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (participant.get('achievedPoints')?.hasError('required')){ @if (participant.get('achievedPoints')?.hasError('required')){
<p>points is required</p> <p>points is required</p>
} }
@if (participant.get('achievedPoints')?.hasError('pattern')){
<p>points must not be less than 0</p>
}
</div> </div>
} }
</div> </div>

2
Ui/src/app/modals/custom-event-participants-model/custom-event-participants-model.component.ts
View File

@ -63,7 +63,7 @@ export class CustomEventParticipantsModelComponent implements OnInit {
playerId: new FormControl(player.playerId), playerId: new FormControl(player.playerId),
playerName: new FormControl<string>(player.playerName), playerName: new FormControl<string>(player.playerName),
participated: new FormControl<boolean>(player.participated), participated: new FormControl<boolean>(player.participated),
achievedPoints: new FormControl<number>(player.achievedPoints, [Validators.required, Validators.pattern('(0|[1-9]\\d*)')]) achievedPoints: new FormControl<number>(player.achievedPoints, [Validators.required])
})) }))
}); });
} }

8
Ui/src/app/modals/invite-user-modal/invite-user-modal.component.html
View File

@ -8,11 +8,11 @@
<form [formGroup]="inviteUserForm"> <form [formGroup]="inviteUserForm">
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['email'].invalid && (f['email'].dirty || f['email'].touched), 'is-invalid': f['email'].invalid && (f['email'].dirty || !f['email'].untouched),
'is-valid': f['email'].valid}" 'is-valid': f['email'].valid}"
type="email" class="form-control" id="email" placeholder="email" formControlName="email"> type="email" class="form-control" id="email" placeholder="email" formControlName="email">
<label for="email">Email</label> <label for="email">Email</label>
@if (f['email'].invalid && (f['email'].dirty || f['email'].touched)) { @if (f['email'].invalid && (f['email'].dirty || !f['email'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['email'].hasError('required')) { @if (f['email'].hasError('required')) {
<p>Email is required</p> <p>Email is required</p>
@ -25,14 +25,14 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<select [ngClass]="{ <select [ngClass]="{
'is-invalid': f['role'].invalid && (f['role'].dirty || f['role'].touched), 'is-invalid': f['role'].invalid && (f['role'].dirty || !f['role'].untouched),
'is-valid': f['role'].valid}" class="form-select" id="role" formControlName="role"> 'is-valid': f['role'].valid}" class="form-select" id="role" formControlName="role">
@for (role of roles; track role) { @for (role of roles; track role) {
<option [ngValue]="role">{{role}}</option> <option [ngValue]="role">{{role}}</option>
} }
</select> </select>
<label for="role">Role</label> <label for="role">Role</label>
@if (f['role'].invalid && (f['role'].dirty || f['role'].touched)) { @if (f['role'].invalid && (f['role'].dirty || !f['role'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['role'].hasError('required')) { @if (f['role'].hasError('required')) {
<p>Role is required</p> <p>Role is required</p>

4
Ui/src/app/modals/player-admonition-modal/player-admonition-modal.component.html
View File

@ -53,10 +53,10 @@
<div class="form-floating mb-3"> <div class="form-floating mb-3">
<textarea [ngClass]="{ <textarea [ngClass]="{
'is-valid': admonitionForm.controls['reason'].valid, 'is-valid': admonitionForm.controls['reason'].valid,
'is-invalid': admonitionForm.controls['reason'].invalid && (admonitionForm.controls['reason'].touched || admonitionForm.controls['reason'].dirty) 'is-invalid': admonitionForm.controls['reason'].invalid && (!admonitionForm.controls['reason'].untouched || admonitionForm.controls['reason'].dirty)
}" class="form-control" maxlength="251" formControlName="reason" placeholder="reason" id="reason" style="height: 100px"></textarea> }" class="form-control" maxlength="251" formControlName="reason" placeholder="reason" id="reason" style="height: 100px"></textarea>
<label for="reason">Reason</label> <label for="reason">Reason</label>
@if (admonitionForm.controls['reason'].invalid && (admonitionForm.controls['reason'].touched || admonitionForm.controls['reason'].dirty)) { @if (admonitionForm.controls['reason'].invalid && (!admonitionForm.controls['reason'].untouched || admonitionForm.controls['reason'].dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (admonitionForm.controls['reason'].hasError('required')) { @if (admonitionForm.controls['reason'].hasError('required')) {
<p>Reason is required</p> <p>Reason is required</p>

12
Ui/src/app/modals/player-edit-modal/player-edit-modal.component.html
View File

@ -8,11 +8,11 @@
<form [formGroup]="playerForm"> <form [formGroup]="playerForm">
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched), 'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched),
'is-valid': f['playerName'].valid}" 'is-valid': f['playerName'].valid}"
type="text" maxlength="251" class="form-control" id="playerName" placeholder="Player" formControlName="playerName"> type="text" maxlength="251" class="form-control" id="playerName" placeholder="Player" formControlName="playerName">
<label for="playerName">Player name</label> <label for="playerName">Player name</label>
@if (f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched)) { @if (f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['playerName'].hasError('required')) { @if (f['playerName'].hasError('required')) {
<p>Player name is required</p> <p>Player name is required</p>
@ -25,11 +25,11 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['level'].invalid && (f['level'].dirty || f['level'].touched), 'is-invalid': f['level'].invalid && (f['level'].dirty || !f['level'].untouched),
'is-valid': f['level'].valid}" 'is-valid': f['level'].valid}"
type="number" class="form-control" id="level" placeholder="level" formControlName="level"> type="number" class="form-control" id="level" placeholder="level" formControlName="level">
<label for="level">Level</label> <label for="level">Level</label>
@if (f['level'].invalid && (f['level'].dirty || f['level'].touched)) { @if (f['level'].invalid && (f['level'].dirty || !f['level'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['level'].hasError('required')) { @if (f['level'].hasError('required')) {
<p>Level is required</p> <p>Level is required</p>
@ -39,14 +39,14 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<select [ngClass]="{ <select [ngClass]="{
'is-invalid': f['rankId'].invalid && (f['rankId'].dirty || f['level'].touched), 'is-invalid': f['rankId'].invalid && (f['rankId'].dirty || !f['level'].untouched),
'is-valid': f['rankId'].valid}" class="form-select" id="rankId" formControlName="rankId"> 'is-valid': f['rankId'].valid}" class="form-select" id="rankId" formControlName="rankId">
@for (rank of ranks; track rank.id) { @for (rank of ranks; track rank.id) {
<option [ngValue]="rank.id">{{rank.name}}</option> <option [ngValue]="rank.id">{{rank.name}}</option>
} }
</select> </select>
<label for="rankId">Rank</label> <label for="rankId">Rank</label>
@if (f['rankId'].invalid && (f['rankId'].dirty || f['rankId'].touched)) { @if (f['rankId'].invalid && (f['rankId'].dirty || !f['rankId'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['rankId'].hasError('required')) { @if (f['rankId'].hasError('required')) {
<p>Rank is required</p> <p>Rank is required</p>

4
Ui/src/app/modals/player-note-modal/player-note-modal.component.html
View File

@ -53,10 +53,10 @@
<div class="form-floating mb-3"> <div class="form-floating mb-3">
<textarea [ngClass]="{ <textarea [ngClass]="{
'is-valid': noteForm.controls['playerNote'].valid, 'is-valid': noteForm.controls['playerNote'].valid,
'is-invalid': noteForm.controls['playerNote'].invalid && (noteForm.controls['playerNote'].touched || noteForm.controls['playerNote'].dirty) 'is-invalid': noteForm.controls['playerNote'].invalid && (!noteForm.controls['playerNote'].untouched || noteForm.controls['playerNote'].dirty)
}" class="form-control" maxlength="501" formControlName="playerNote" placeholder="playerNote" id="playerNote" style="height: 100px"></textarea> }" class="form-control" maxlength="501" formControlName="playerNote" placeholder="playerNote" id="playerNote" style="height: 100px"></textarea>
<label for="playerNote">Note</label> <label for="playerNote">Note</label>
@if (noteForm.controls['playerNote'].invalid && (noteForm.controls['playerNote'].touched || noteForm.controls['playerNote'].dirty)) { @if (noteForm.controls['playerNote'].invalid && (!noteForm.controls['playerNote'].untouched || noteForm.controls['playerNote'].dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (noteForm.controls['playerNote'].hasError('required')) { @if (noteForm.controls['playerNote'].hasError('required')) {
<p>Note is required</p> <p>Note is required</p>

12
Ui/src/app/modals/user-edit-modal/user-edit-modal.component.html
View File

@ -8,11 +8,11 @@
<form [formGroup]="userForm"> <form [formGroup]="userForm">
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched), 'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched),
'is-valid': f['playerName'].valid}" 'is-valid': f['playerName'].valid}"
type="text" maxlength="251" class="form-control" id="playerName" placeholder="Player" formControlName="playerName"> type="text" maxlength="251" class="form-control" id="playerName" placeholder="Player" formControlName="playerName">
<label for="playerName">Player name</label> <label for="playerName">Player name</label>
@if (f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched)) { @if (f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['playerName'].hasError('required')) { @if (f['playerName'].hasError('required')) {
<p>Player name is required</p> <p>Player name is required</p>
@ -25,11 +25,11 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['email'].invalid && (f['email'].dirty || f['email'].touched), 'is-invalid': f['email'].invalid && (f['email'].dirty || !f['email'].untouched),
'is-valid': f['email'].valid}" 'is-valid': f['email'].valid}"
type="email" class="form-control" id="email" placeholder="email" formControlName="email"> type="email" class="form-control" id="email" placeholder="email" formControlName="email">
<label for="email">Email</label> <label for="email">Email</label>
@if (f['email'].invalid && (f['email'].dirty || f['email'].touched)) { @if (f['email'].invalid && (f['email'].dirty || !f['email'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['email'].hasError('required')) { @if (f['email'].hasError('required')) {
<p>Email is required</p> <p>Email is required</p>
@ -42,14 +42,14 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<select [ngClass]="{ <select [ngClass]="{
'is-invalid': f['role'].invalid && (f['role'].dirty || f['level'].touched), 'is-invalid': f['role'].invalid && (f['role'].dirty || !f['level'].untouched),
'is-valid': f['role'].valid}" class="form-select" id="role" formControlName="role"> 'is-valid': f['role'].valid}" class="form-select" id="role" formControlName="role">
@for (role of roles; track role) { @for (role of roles; track role) {
<option [ngValue]="role">{{role}}</option> <option [ngValue]="role">{{role}}</option>
} }
</select> </select>
<label for="role">Role</label> <label for="role">Role</label>
@if (f['role'].invalid && (f['role'].dirty || f['role'].touched)) { @if (f['role'].invalid && (f['role'].dirty || !f['role'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['role'].hasError('required')) { @if (f['role'].hasError('required')) {
<p>Role is required</p> <p>Role is required</p>

22
Ui/src/app/modals/vs-duel-create-modal/vs-duel-create-modal.component.html
View File

@ -12,11 +12,11 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['opponentName'].invalid && (f['opponentName'].dirty || f['opponentName'].touched), 'is-invalid': f['opponentName'].invalid && (f['opponentName'].dirty || !f['opponentName'].untouched),
'is-valid': f['opponentName'].valid}" 'is-valid': f['opponentName'].valid}"
type="text" class="form-control" id="opponentName" placeholder="opponentName" formControlName="opponentName"> type="text" class="form-control" id="opponentName" placeholder="opponentName" formControlName="opponentName">
<label for="opponentName">Opponent name</label> <label for="opponentName">Opponent name</label>
@if (f['opponentName'].invalid && (f['opponentName'].dirty || f['opponentName'].touched)) { @if (f['opponentName'].invalid && (f['opponentName'].dirty || !f['opponentName'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['opponentName'].hasError('required')) { @if (f['opponentName'].hasError('required')) {
<p>Opponent name is required</p> <p>Opponent name is required</p>
@ -26,11 +26,11 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['opponentServer'].invalid && (f['opponentServer'].dirty || f['opponentServer'].touched), 'is-invalid': f['opponentServer'].invalid && (f['opponentServer'].dirty || !f['opponentServer'].untouched),
'is-valid': f['opponentServer'].valid}" 'is-valid': f['opponentServer'].valid}"
type="number" class="form-control" id="opponentServer" placeholder="opponentServer" formControlName="opponentServer"> type="number" class="form-control" id="opponentServer" placeholder="opponentServer" formControlName="opponentServer">
<label for="opponentServer">opponentServer</label> <label for="opponentServer">opponentServer</label>
@if (f['opponentServer'].invalid && (f['opponentServer'].dirty || f['opponentServer'].touched)) { @if (f['opponentServer'].invalid && (f['opponentServer'].dirty || !f['opponentServer'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['opponentServer'].hasError('required')) { @if (f['opponentServer'].hasError('required')) {
<p>opponentServer is required</p> <p>opponentServer is required</p>
@ -40,11 +40,11 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['opponentPower'].invalid && (f['opponentPower'].dirty || f['opponentPower'].touched), 'is-invalid': f['opponentPower'].invalid && (f['opponentPower'].dirty || !f['opponentPower'].untouched),
'is-valid': f['opponentPower'].valid}" 'is-valid': f['opponentPower'].valid}"
type="number" class="form-control" id="opponentPower" placeholder="opponentPower" formControlName="opponentPower"> type="text" mask="separator.2" thousandSeparator="." separatorLimit="9999999999999999" class="form-control" id="opponentPower" placeholder="opponentPower" formControlName="opponentPower">
<label for="opponentPower">opponentPower</label> <label for="opponentPower">opponentPower</label>
@if (f['opponentPower'].invalid && (f['opponentPower'].dirty || f['opponentPower'].touched)) { @if (f['opponentPower'].invalid && (f['opponentPower'].dirty || !f['opponentPower'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['opponentPower'].hasError('required')) { @if (f['opponentPower'].hasError('required')) {
<p>opponentPower is required</p> <p>opponentPower is required</p>
@ -54,11 +54,11 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['opponentSize'].invalid && (f['opponentSize'].dirty || f['opponentSize'].touched), 'is-invalid': f['opponentSize'].invalid && (f['opponentSize'].dirty || !f['opponentSize'].untouched),
'is-valid': f['opponentSize'].valid}" 'is-valid': f['opponentSize'].valid}"
type="number" class="form-control" id="opponentSize" placeholder="opponentSize" formControlName="opponentSize"> type="number" class="form-control" id="opponentSize" placeholder="opponentSize" formControlName="opponentSize">
<label for="opponentSize">opponentSize</label> <label for="opponentSize">opponentSize</label>
@if (f['opponentSize'].invalid && (f['opponentSize'].dirty || f['opponentSize'].touched)) { @if (f['opponentSize'].invalid && (f['opponentSize'].dirty || !f['opponentSize'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['opponentSize'].hasError('required')) { @if (f['opponentSize'].hasError('required')) {
<p>opponentSize is required</p> <p>opponentSize is required</p>
@ -68,14 +68,14 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<select [ngClass]="{ <select [ngClass]="{
'is-invalid': f['vsDuelLeagueId'].invalid && (f['vsDuelLeagueId'].dirty || f['vsDuelLeagueId'].touched), 'is-invalid': f['vsDuelLeagueId'].invalid && (f['vsDuelLeagueId'].dirty || !f['vsDuelLeagueId'].untouched),
'is-valid': f['vsDuelLeagueId'].valid}" class="form-select" id="vsDuelLeagueId" formControlName="vsDuelLeagueId"> 'is-valid': f['vsDuelLeagueId'].valid}" class="form-select" id="vsDuelLeagueId" formControlName="vsDuelLeagueId">
@for (vsDuelLeague of vsDuelLeagues; track vsDuelLeague.id) { @for (vsDuelLeague of vsDuelLeagues; track vsDuelLeague.id) {
<option [ngValue]="vsDuelLeague.id">{{vsDuelLeague.name}}</option> <option [ngValue]="vsDuelLeague.id">{{vsDuelLeague.name}}</option>
} }
</select> </select>
<label for="vsDuelLeagueId">Vs Duel League</label> <label for="vsDuelLeagueId">Vs Duel League</label>
@if (f['vsDuelLeagueId'].invalid && (f['vsDuelLeagueId'].dirty || f['vsDuelLeagueId'].touched)) { @if (f['vsDuelLeagueId'].invalid && (f['vsDuelLeagueId'].dirty || !f['vsDuelLeagueId'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['vsDuelLeagueId'].hasError('required')) { @if (f['vsDuelLeagueId'].hasError('required')) {
<p>Vs Duel League is required</p> <p>Vs Duel League is required</p>

4
Ui/src/app/pages/account/account.component.html
View File

@ -5,11 +5,11 @@
<form [formGroup]="userForm" (ngSubmit)="onSubmit()"> <form [formGroup]="userForm" (ngSubmit)="onSubmit()">
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched), 'is-invalid': f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched),
'is-valid': f['playerName'].valid}" 'is-valid': f['playerName'].valid}"
type="text" maxlength="251" class="form-control" id="playerName" placeholder="Player" formControlName="playerName"> type="text" maxlength="251" class="form-control" id="playerName" placeholder="Player" formControlName="playerName">
<label for="playerName">Player name</label> <label for="playerName">Player name</label>
@if (f['playerName'].invalid && (f['playerName'].dirty || f['playerName'].touched)) { @if (f['playerName'].invalid && (f['playerName'].dirty || !f['playerName'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['playerName'].hasError('required')) { @if (f['playerName'].hasError('required')) {
<p>Player name is required</p> <p>Player name is required</p>

12
Ui/src/app/pages/alliance/alliance.component.html
View File

@ -20,10 +20,10 @@
<div class="form-floating mb-3"> <div class="form-floating mb-3">
<input [ngClass]="{ <input [ngClass]="{
'is-valid': f['server'].valid, 'is-valid': f['server'].valid,
'is-invalid': f['server'].invalid && (f['server'].touched || f['server'].dirty ) 'is-invalid': f['server'].invalid && (!f['server'].untouched || f['server'].dirty )
}" type="number" min="0" formControlName="server" class="form-control" id="server" placeholder="469"> }" type="number" min="0" formControlName="server" class="form-control" id="server" placeholder="469">
<label for="server">Server</label> <label for="server">Server</label>
@if (f['server'].invalid && (f['server'].touched || f['server'].dirty)) { @if (f['server'].invalid && (!f['server'].untouched || f['server'].dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['server'].hasError('required')) { @if (f['server'].hasError('required')) {
<p>Server is required</p> <p>Server is required</p>
@ -35,10 +35,10 @@
<div class="form-floating mb-3"> <div class="form-floating mb-3">
<input [ngClass]="{ <input [ngClass]="{
'is-valid': f['name'].valid, 'is-valid': f['name'].valid,
'is-invalid': f['name'].invalid && (f['name'].touched || f['name'].dirty ) 'is-invalid': f['name'].invalid && (!f['name'].untouched || f['name'].dirty )
}" type="text" formControlName="name" maxlength="201" class="form-control" id="name" placeholder="Old Vikings"> }" type="text" formControlName="name" maxlength="201" class="form-control" id="name" placeholder="Old Vikings">
<label for="name">Name</label> <label for="name">Name</label>
@if (f['name'].invalid && (f['name'].touched || f['name'].dirty)) { @if (f['name'].invalid && (!f['name'].untouched || f['name'].dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['name'].hasError('required')) { @if (f['name'].hasError('required')) {
<p>Name is required</p> <p>Name is required</p>
@ -53,11 +53,11 @@
<div class="form-floating mb-3"> <div class="form-floating mb-3">
<input [ngClass]="{ <input [ngClass]="{
'is-valid': f['abbreviation'].valid, 'is-valid': f['abbreviation'].valid,
'is-invalid': f['abbreviation'].invalid && (f['abbreviation'].touched || f['abbreviation'].dirty ) 'is-invalid': f['abbreviation'].invalid && (!f['abbreviation'].untouched || f['abbreviation'].dirty )
}" type="text" formControlName="abbreviation" maxlength="5" class="form-control" id="abbreviation" }" type="text" formControlName="abbreviation" maxlength="5" class="form-control" id="abbreviation"
placeholder="vis"> placeholder="vis">
<label for="abbreviation">Abbreviation</label> <label for="abbreviation">Abbreviation</label>
@if (f['abbreviation'].invalid && (f['abbreviation'].touched || f['abbreviation'].dirty)) { @if (f['abbreviation'].invalid && (!f['abbreviation'].untouched || f['abbreviation'].dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['abbreviation'].hasError('required')) { @if (f['abbreviation'].hasError('required')) {
<p>Abbreviation is required</p> <p>Abbreviation is required</p>

12
Ui/src/app/pages/change-password/change-password.component.html
View File

@ -8,7 +8,7 @@
<div class="input-group has-validation mb-3"> <div class="input-group has-validation mb-3">
<div class="form-floating is-invalid"> <div class="form-floating is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['currentPassword'].invalid && (f['currentPassword'].dirty || f['currentPassword'].touched), 'is-invalid': f['currentPassword'].invalid && (f['currentPassword'].dirty || !f['currentPassword'].untouched),
'is-valid': f['currentPassword'].valid 'is-valid': f['currentPassword'].valid
}" [type]="isPasswordType ? 'password' : 'text'" autocomplete="on" class="form-control" }" [type]="isPasswordType ? 'password' : 'text'" autocomplete="on" class="form-control"
formControlName="currentPassword" id="currentPassword" placeholder="currentPassword"> formControlName="currentPassword" id="currentPassword" placeholder="currentPassword">
@ -21,7 +21,7 @@
class="input-group-text eye-icon bi"></i> class="input-group-text eye-icon bi"></i>
</span> </span>
<!-- Error message for current password field --> <!-- Error message for current password field -->
@if (f['currentPassword'].invalid && (f['currentPassword'].dirty || f['currentPassword'].touched )) { @if (f['currentPassword'].invalid && (f['currentPassword'].dirty || !f['currentPassword'].untouched )) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['currentPassword'].hasError('required')) { @if (f['currentPassword'].hasError('required')) {
<p>Password is required</p> <p>Password is required</p>
@ -34,7 +34,7 @@
<div class="input-group has-validation mb-3"> <div class="input-group has-validation mb-3">
<div class="form-floating is-invalid"> <div class="form-floating is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['newPassword'].invalid && (f['newPassword'].dirty || f['newPassword'].touched), 'is-invalid': f['newPassword'].invalid && (f['newPassword'].dirty || !f['newPassword'].untouched),
'is-valid': f['newPassword'].valid 'is-valid': f['newPassword'].valid
}" [type]="isPasswordType ? 'password' : 'text'" autocomplete="on" class="form-control" }" [type]="isPasswordType ? 'password' : 'text'" autocomplete="on" class="form-control"
formControlName="newPassword" formControlName="newPassword"
@ -48,7 +48,7 @@
class="input-group-text eye-icon bi"></i> class="input-group-text eye-icon bi"></i>
</span> </span>
<!-- Error messages for new password field --> <!-- Error messages for new password field -->
@if (f['newPassword'].invalid && (f['newPassword'].dirty || f['newPassword'].touched )) { @if (f['newPassword'].invalid && (f['newPassword'].dirty || !f['newPassword'].untouched )) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['newPassword'].hasError('required')) { @if (f['newPassword'].hasError('required')) {
<p>Password is required</p> <p>Password is required</p>
@ -92,7 +92,7 @@
<div class="input-group has-validation mb-3"> <div class="input-group has-validation mb-3">
<div class="form-floating is-invalid"> <div class="form-floating is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched), 'is-invalid': f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched),
'is-valid': f['confirmPassword'].valid 'is-valid': f['confirmPassword'].valid
}" [type]="isPasswordType ? 'password': 'text'" autocomplete="on" class="form-control" }" [type]="isPasswordType ? 'password': 'text'" autocomplete="on" class="form-control"
formControlName="confirmPassword" formControlName="confirmPassword"
@ -106,7 +106,7 @@
class="input-group-text eye-icon bi"></i> class="input-group-text eye-icon bi"></i>
</span> </span>
<!-- Error messages for confirming new password field --> <!-- Error messages for confirming new password field -->
@if (f['confirmPassword'].invalid && (f['confirmPassword'].dirty || f['confirmPassword'].touched )) { @if (f['confirmPassword'].invalid && (f['confirmPassword'].dirty || !f['confirmPassword'].untouched )) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['confirmPassword'].hasError('required')) { @if (f['confirmPassword'].hasError('required')) {
<p>Repeat password is required</p> <p>Repeat password is required</p>

3
Ui/src/app/pages/custom-event/custom-event-detail/custom-event-detail.component.html
View File

@ -12,6 +12,9 @@
<div class="card-body"> <div class="card-body">
<h5 class="card-title">Name: <span class="text-primary">{{customEventDetail.name}}</span></h5> <h5 class="card-title">Name: <span class="text-primary">{{customEventDetail.name}}</span></h5>
<p class="card-text">Description: <span class="text-primary">{{customEventDetail.description}}</span></p> <p class="card-text">Description: <span class="text-primary">{{customEventDetail.description}}</span></p>
@if (customEventDetail.customEventCategoryId) {
<p class="card-text">Category: <span class="text-primary">{{customEventDetail.categoryName}}</span></p>
}
<p class="card-text">Point event: <p class="card-text">Point event:
<i class="bi " [ngClass]="customEventDetail.isPointsEvent ? 'bi-check-lg text-success' : 'bi-x-lg text-danger'"></i> <i class="bi " [ngClass]="customEventDetail.isPointsEvent ? 'bi-check-lg text-success' : 'bi-x-lg text-danger'"></i>
</p> </p>

6
Ui/src/app/pages/custom-event/custom-event-events/custom-event-events.component.ts
View File

@ -101,7 +101,7 @@ export class CustomEventEventsComponent implements OnInit {
this.customEventForm = new FormGroup({ this.customEventForm = new FormGroup({
id: new FormControl<string>(isUpdate ? customEventDetail!.id : ''), id: new FormControl<string>(isUpdate ? customEventDetail!.id : ''),
allianceId: new FormControl<string>(this.allianceId), allianceId: new FormControl<string>(this.allianceId),
customEventCategoryId: new FormControl<string | null>(null), customEventCategoryId: new FormControl<string | null>(isUpdate ? customEventDetail?.customEventCategoryId ? customEventDetail.customEventCategoryId : null : null),
name: new FormControl<string>(isUpdate ? customEventDetail!.name : '', [Validators.required, Validators.maxLength(150)]), name: new FormControl<string>(isUpdate ? customEventDetail!.name : '', [Validators.required, Validators.maxLength(150)]),
description: new FormControl<string>(isUpdate ? customEventDetail!.description : '', [Validators.required, Validators.maxLength(500)]), description: new FormControl<string>(isUpdate ? customEventDetail!.description : '', [Validators.required, Validators.maxLength(500)]),
isPointsEvent: new FormControl<boolean>(isUpdate ? customEventDetail!.isPointsEvent : false), isPointsEvent: new FormControl<boolean>(isUpdate ? customEventDetail!.isPointsEvent : false),
@ -112,6 +112,10 @@ export class CustomEventEventsComponent implements OnInit {
this.isCreateCustomEvent = true; this.isCreateCustomEvent = true;
if (isUpdate) { if (isUpdate) {
this.customEventForm.controls['customEventCategoryId'].disable(); this.customEventForm.controls['customEventCategoryId'].disable();
if (customEventDetail?.customEventCategoryId) {
this.customEventForm.controls['isPointsEvent'].disable();
this.customEventForm.controls['isParticipationEvent'].disable();
}
} }
} }

12
Ui/src/app/pages/desert-storm/desert-storm.component.html
View File

@ -30,11 +30,11 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['opponentName'].invalid && (f['opponentName'].dirty || f['opponentName'].touched), 'is-invalid': f['opponentName'].invalid && (f['opponentName'].dirty || !f['opponentName'].untouched),
'is-valid': f['opponentName'].valid}" 'is-valid': f['opponentName'].valid}"
type="text" class="form-control" id="opponentName" placeholder="opponentName" formControlName="opponentName"> type="text" class="form-control" id="opponentName" placeholder="opponentName" formControlName="opponentName">
<label for="opponentName">Opponent name</label> <label for="opponentName">Opponent name</label>
@if (f['opponentName'].invalid && (f['opponentName'].dirty || f['opponentName'].touched)) { @if (f['opponentName'].invalid && (f['opponentName'].dirty || !f['opponentName'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['opponentName'].hasError('required')) { @if (f['opponentName'].hasError('required')) {
<p>Opponent name is required</p> <p>Opponent name is required</p>
@ -45,11 +45,11 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['opponentServer'].invalid && (f['opponentServer'].dirty || f['opponentServer'].touched), 'is-invalid': f['opponentServer'].invalid && (f['opponentServer'].dirty || !f['opponentServer'].untouched),
'is-valid': f['opponentServer'].valid}" 'is-valid': f['opponentServer'].valid}"
type="number" class="form-control" id="opponentServer" placeholder="opponentServer" formControlName="opponentServer"> type="number" class="form-control" id="opponentServer" placeholder="opponentServer" formControlName="opponentServer">
<label for="opponentServer">opponentServer</label> <label for="opponentServer">opponentServer</label>
@if (f['opponentServer'].invalid && (f['opponentServer'].dirty || f['opponentServer'].touched)) { @if (f['opponentServer'].invalid && (f['opponentServer'].dirty || !f['opponentServer'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['opponentServer'].hasError('required')) { @if (f['opponentServer'].hasError('required')) {
<p>opponentServer is required</p> <p>opponentServer is required</p>
@ -60,11 +60,11 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['OpposingParticipants'].invalid && (f['OpposingParticipants'].dirty || f['OpposingParticipants'].touched), 'is-invalid': f['OpposingParticipants'].invalid && (f['OpposingParticipants'].dirty || !f['OpposingParticipants'].untouched),
'is-valid': f['OpposingParticipants'].valid}" 'is-valid': f['OpposingParticipants'].valid}"
type="number" class="form-control" id="OpposingParticipants" placeholder="OpposingParticipants" formControlName="OpposingParticipants"> type="number" class="form-control" id="OpposingParticipants" placeholder="OpposingParticipants" formControlName="OpposingParticipants">
<label for="OpposingParticipants">OpposingParticipants</label> <label for="OpposingParticipants">OpposingParticipants</label>
@if (f['OpposingParticipants'].invalid && (f['OpposingParticipants'].dirty || f['OpposingParticipants'].touched)) { @if (f['OpposingParticipants'].invalid && (f['OpposingParticipants'].dirty || !f['OpposingParticipants'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['opponentPower'].hasError('required')) { @if (f['opponentPower'].hasError('required')) {
<p>OpposingParticipants is required</p> <p>OpposingParticipants is required</p>

30
Ui/src/app/pages/feedback/feedback.component.html
View File

@ -7,7 +7,7 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<select [ngClass]="{ <select [ngClass]="{
'is-valid': f['type'].valid, 'is-valid': f['type'].valid,
'is-invalid': f['type'].invalid && (f['type'].touched || f['type'].dirty) 'is-invalid': f['type'].invalid && (!f['type'].untouched || f['type'].dirty)
}" class="form-control" id="type" formControlName="type" (change)="onTypeChange($event)"> }" class="form-control" id="type" formControlName="type" (change)="onTypeChange($event)">
<option value="bug">Bug Report</option> <option value="bug">Bug Report</option>
<option value="feature">Feature Request</option> <option value="feature">Feature Request</option>
@ -18,10 +18,10 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-valid': f['title'].valid, 'is-valid': f['title'].valid,
'is-invalid': f['title'].invalid && (f['title'].touched || f['title'].dirty) 'is-invalid': f['title'].invalid && (!f['title'].untouched || f['title'].dirty)
}" type="text" class="form-control" id="title" placeholder="Title" formControlName="title"> }" type="text" class="form-control" id="title" placeholder="Title" formControlName="title">
<label for="title">Title</label> <label for="title">Title</label>
@if (f['title'].invalid && (f['title'].touched || f['title'].dirty)) { @if (f['title'].invalid && (!f['title'].untouched || f['title'].dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['title'].hasError('required')) { @if (f['title'].hasError('required')) {
<p>Title is required</p> <p>Title is required</p>
@ -33,10 +33,10 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<textarea [ngClass]="{ <textarea [ngClass]="{
'is-valid': f['description'].valid, 'is-valid': f['description'].valid,
'is-invalid': f['description'].invalid && (f['description'].touched || f['description'].dirty) 'is-invalid': f['description'].invalid && (!f['description'].untouched || f['description'].dirty)
}" class="form-control" id="description" formControlName="description" placeholder="Describe the issue or feature" style="height: 100px;"></textarea> }" class="form-control" id="description" formControlName="description" placeholder="Describe the issue or feature" style="height: 100px;"></textarea>
<label for="description">Description</label> <label for="description">Description</label>
@if (f['description'].invalid && (f['description'].touched || f['description'].dirty)) { @if (f['description'].invalid && (!f['description'].untouched || f['description'].dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['description'].hasError('required')) { @if (f['description'].hasError('required')) {
<p>Description is required</p> <p>Description is required</p>
@ -54,10 +54,10 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<textarea [ngClass]="{ <textarea [ngClass]="{
'is-valid': f['expectedBehavior'].valid, 'is-valid': f['expectedBehavior'].valid,
'is-invalid': f['expectedBehavior'].invalid && (f['expectedBehavior'].touched || f['expectedBehavior'].dirty) 'is-invalid': f['expectedBehavior'].invalid && (!f['expectedBehavior'].untouched || f['expectedBehavior'].dirty)
}" class="form-control" id="expectedBehavior" formControlName="expectedBehavior" placeholder="What did you expect to happen?" style="height: 100px;"></textarea> }" class="form-control" id="expectedBehavior" formControlName="expectedBehavior" placeholder="What did you expect to happen?" style="height: 100px;"></textarea>
<label for="expectedBehavior">Expected Behavior</label> <label for="expectedBehavior">Expected Behavior</label>
@if (f['expectedBehavior'].invalid && (f['expectedBehavior'].touched || f['expectedBehavior'].dirty)) { @if (f['expectedBehavior'].invalid && (!f['expectedBehavior'].untouched || f['expectedBehavior'].dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['expectedBehavior'].hasError('required')) { @if (f['expectedBehavior'].hasError('required')) {
<p>ExpectedBehavior is required</p> <p>ExpectedBehavior is required</p>
@ -69,10 +69,10 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<textarea [ngClass]="{ <textarea [ngClass]="{
'is-valid': f['actualBehavior'].valid, 'is-valid': f['actualBehavior'].valid,
'is-invalid': f['actualBehavior'].invalid && (f['actualBehavior'].touched || f['actualBehavior'].dirty) 'is-invalid': f['actualBehavior'].invalid && (!f['actualBehavior'].untouched || f['actualBehavior'].dirty)
}" class="form-control" id="actualBehavior" formControlName="actualBehavior" placeholder="What actually happened?" style="height: 100px;"></textarea> }" class="form-control" id="actualBehavior" formControlName="actualBehavior" placeholder="What actually happened?" style="height: 100px;"></textarea>
<label for="actualBehavior">Actual Behavior</label> <label for="actualBehavior">Actual Behavior</label>
@if (f['actualBehavior'].invalid && (f['actualBehavior'].touched || f['actualBehavior'].dirty)) { @if (f['actualBehavior'].invalid && (!f['actualBehavior'].untouched || f['actualBehavior'].dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['actualBehavior'].hasError('required')) { @if (f['actualBehavior'].hasError('required')) {
<p>ActualBehavior is required</p> <p>ActualBehavior is required</p>
@ -84,10 +84,10 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<textarea [ngClass]="{ <textarea [ngClass]="{
'is-valid': f['reproduction'].valid, 'is-valid': f['reproduction'].valid,
'is-invalid': f['reproduction'].invalid && (f['reproduction'].touched || f['reproduction'].dirty) 'is-invalid': f['reproduction'].invalid && (!f['reproduction'].untouched || f['reproduction'].dirty)
}" class="form-control" id="reproduction" formControlName="reproduction" placeholder="List the steps to reproduce the issue" style="height: 100px;"></textarea> }" class="form-control" id="reproduction" formControlName="reproduction" placeholder="List the steps to reproduce the issue" style="height: 100px;"></textarea>
<label for="reproduction">Steps to Reproduce</label> <label for="reproduction">Steps to Reproduce</label>
@if (f['reproduction'].invalid && (f['reproduction'].touched || f['reproduction'].dirty)) { @if (f['reproduction'].invalid && (!f['reproduction'].untouched || f['reproduction'].dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['reproduction'].hasError('required')) { @if (f['reproduction'].hasError('required')) {
<p>Reproduction is required</p> <p>Reproduction is required</p>
@ -99,7 +99,7 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<select [ngClass]="{ <select [ngClass]="{
'is-valid': f['severity'].valid, 'is-valid': f['severity'].valid,
'is-invalid': f['severity'].invalid && (f['severity'].touched || f['severity'].dirty) 'is-invalid': f['severity'].invalid && (!f['severity'].untouched || f['severity'].dirty)
}" class="form-control" id="severity" formControlName="severity"> }" class="form-control" id="severity" formControlName="severity">
<option value="low">Low</option> <option value="low">Low</option>
<option value="medium">Medium</option> <option value="medium">Medium</option>
@ -111,7 +111,7 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<select [ngClass]="{ <select [ngClass]="{
'is-valid': f['os'].valid, 'is-valid': f['os'].valid,
'is-invalid': f['os'].invalid && (f['os'].touched || f['os'].dirty) 'is-invalid': f['os'].invalid && (!f['os'].untouched || f['os'].dirty)
}" class="form-control" id="os" formControlName="os"> }" class="form-control" id="os" formControlName="os">
<option value="windows">Windows</option> <option value="windows">Windows</option>
<option value="macos">macOS</option> <option value="macos">macOS</option>
@ -120,7 +120,7 @@
<option value="ios">iOS</option> <option value="ios">iOS</option>
</select> </select>
<label for="os">Operating System</label> <label for="os">Operating System</label>
@if (f['os'].invalid && (f['os'].touched || f['os'].dirty)) { @if (f['os'].invalid && (!f['os'].untouched || f['os'].dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['os'].hasError('required')) { @if (f['os'].hasError('required')) {
<p>Operating System is required</p> <p>Operating System is required</p>
@ -132,7 +132,7 @@
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-valid': f['appVersion'].valid, 'is-valid': f['appVersion'].valid,
'is-invalid': f['appVersion'].invalid && (f['appVersion'].touched || f['appVersion'].dirty) 'is-invalid': f['appVersion'].invalid && (!f['appVersion'].untouched || f['appVersion'].dirty)
}" type="text" class="form-control" id="appVersion" formControlName="appVersion" placeholder="App version (e.g., 1.2.3)" readonly> }" type="text" class="form-control" id="appVersion" formControlName="appVersion" placeholder="App version (e.g., 1.2.3)" readonly>
<label for="appVersion">App Version</label> <label for="appVersion">App Version</label>
</div> </div>

8
Ui/src/app/pages/marshal-guard/marshal-guard.component.html
View File

@ -11,11 +11,11 @@
<form [formGroup]="marshalGuardForm"> <form [formGroup]="marshalGuardForm">
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['eventDate'].invalid && (f['eventDate'].dirty || f['eventDate'].touched), 'is-invalid': f['eventDate'].invalid && (f['eventDate'].dirty || !f['eventDate'].untouched),
'is-valid': f['eventDate'].valid}" 'is-valid': f['eventDate'].valid}"
type="date" class="form-control" id="eventDate" placeholder="eventDate" formControlName="eventDate"> type="date" class="form-control" id="eventDate" placeholder="eventDate" formControlName="eventDate">
<label for="level">eventDate</label> <label for="level">eventDate</label>
@if (f['eventDate'].invalid && (f['eventDate'].dirty || f['eventDate'].touched)) { @if (f['eventDate'].invalid && (f['eventDate'].dirty || !f['eventDate'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['eventDate'].hasError('required')) { @if (f['eventDate'].hasError('required')) {
<p>eventDate is required</p> <p>eventDate is required</p>
@ -25,11 +25,11 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['level'].invalid && (f['level'].dirty || f['level'].touched), 'is-invalid': f['level'].invalid && (f['level'].dirty || !f['level'].untouched),
'is-valid': f['level'].valid}" 'is-valid': f['level'].valid}"
type="number" class="form-control" id="level" placeholder="level" formControlName="level"> type="number" class="form-control" id="level" placeholder="level" formControlName="level">
<label for="level">Level</label> <label for="level">Level</label>
@if (f['level'].invalid && (f['level'].dirty || f['level'].touched)) { @if (f['level'].invalid && (f['level'].dirty || !f['level'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['level'].hasError('required')) { @if (f['level'].hasError('required')) {
<p>Level is required</p> <p>Level is required</p>

24
Ui/src/app/pages/vs-duel/vs-duel-edit/vs-duel-edit.component.html
View File

@ -17,11 +17,11 @@
<form [formGroup]="vsDuelForm"> <form [formGroup]="vsDuelForm">
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': df['opponentName'].invalid && (df['opponentName'].dirty || df['opponentName'].touched), 'is-invalid': df['opponentName'].invalid && (df['opponentName'].dirty || !df['opponentName'].untouched),
'is-valid': df['opponentName'].valid}" 'is-valid': df['opponentName'].valid}"
type="text" maxlength="151" class="form-control" id="opponentName" placeholder="opponentName" formControlName="opponentName"> type="text" maxlength="151" class="form-control" id="opponentName" placeholder="opponentName" formControlName="opponentName">
<label for="opponentName">Opponent name</label> <label for="opponentName">Opponent name</label>
@if (df['opponentName'].invalid && (df['opponentName'].dirty || df['opponentName'].touched)) { @if (df['opponentName'].invalid && (df['opponentName'].dirty || !df['opponentName'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (df['opponentName'].hasError('required')) { @if (df['opponentName'].hasError('required')) {
<p>Opponent Name is required</p> <p>Opponent Name is required</p>
@ -34,11 +34,11 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': df['opponentServer'].invalid && (df['opponentServer'].dirty || df['opponentServer'].touched), 'is-invalid': df['opponentServer'].invalid && (df['opponentServer'].dirty || !df['opponentServer'].untouched),
'is-valid': df['opponentServer'].valid}" 'is-valid': df['opponentServer'].valid}"
type="number" min="0" class="form-control" id="opponentServer" placeholder="opponentServer" formControlName="opponentServer"> type="number" min="0" class="form-control" id="opponentServer" placeholder="opponentServer" formControlName="opponentServer">
<label for="opponentServer">Opponent server</label> <label for="opponentServer">Opponent server</label>
@if (df['opponentServer'].invalid && (df['opponentServer'].dirty || df['opponentServer'].touched)) { @if (df['opponentServer'].invalid && (df['opponentServer'].dirty || !df['opponentServer'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (df['opponentServer'].hasError('required')) { @if (df['opponentServer'].hasError('required')) {
<p>Opponent server is required</p> <p>Opponent server is required</p>
@ -48,11 +48,11 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': df['opponentPower'].invalid && (df['opponentPower'].dirty || df['opponentPower'].touched), 'is-invalid': df['opponentPower'].invalid && (df['opponentPower'].dirty || !df['opponentPower'].untouched),
'is-valid': df['opponentPower'].valid}" 'is-valid': df['opponentPower'].valid}"
type="number" min="0" class="form-control" id="opponentPower" placeholder="opponentPower" formControlName="opponentPower"> type="text" mask="separator.2" thousandSeparator="." separatorLimit="9999999999999999" class="form-control" id="opponentPower" placeholder="opponentPower" formControlName="opponentPower">
<label for="opponentPower">Opponent power</label> <label for="opponentPower">Opponent power</label>
@if (df['opponentPower'].invalid && (df['opponentPower'].dirty || df['opponentPower'].touched)) { @if (df['opponentPower'].invalid && (df['opponentPower'].dirty || !df['opponentPower'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (df['opponentPower'].hasError('required')) { @if (df['opponentPower'].hasError('required')) {
<p>Opponent power is required</p> <p>Opponent power is required</p>
@ -62,11 +62,11 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': df['opponentSize'].invalid && (df['opponentSize'].dirty || df['opponentSize'].touched), 'is-invalid': df['opponentSize'].invalid && (df['opponentSize'].dirty || !df['opponentSize'].untouched),
'is-valid': df['opponentSize'].valid}" 'is-valid': df['opponentSize'].valid}"
type="number" min="0" class="form-control" id="opponentSize" placeholder="opponentSize" formControlName="opponentSize"> type="number" min="0" class="form-control" id="opponentSize" placeholder="opponentSize" formControlName="opponentSize">
<label for="opponentSize">Opponent size</label> <label for="opponentSize">Opponent size</label>
@if (df['opponentSize'].invalid && (df['opponentSize'].dirty || df['opponentSize'].touched)) { @if (df['opponentSize'].invalid && (df['opponentSize'].dirty || !df['opponentSize'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (df['opponentSize'].hasError('required')) { @if (df['opponentSize'].hasError('required')) {
<p>Opponent size is required</p> <p>Opponent size is required</p>
@ -76,14 +76,14 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<select [ngClass]="{ <select [ngClass]="{
'is-invalid': df['vsDuelLeagueId'].invalid && (df['vsDuelLeagueId'].dirty || df['vsDuelLeagueId'].touched), 'is-invalid': df['vsDuelLeagueId'].invalid && (df['vsDuelLeagueId'].dirty || !df['vsDuelLeagueId'].untouched),
'is-valid': df['vsDuelLeagueId'].valid}" class="form-control" id="vsDuelLeagueId" formControlName="vsDuelLeagueId"> 'is-valid': df['vsDuelLeagueId'].valid}" class="form-control" id="vsDuelLeagueId" formControlName="vsDuelLeagueId">
@for (vsDuelLeague of vsDuelLeagues; track vsDuelLeague.id) { @for (vsDuelLeague of vsDuelLeagues; track vsDuelLeague.id) {
<option [ngValue]="vsDuelLeague.id">{{vsDuelLeague.name}}</option> <option [ngValue]="vsDuelLeague.id">{{vsDuelLeague.name}}</option>
} }
</select> </select>
<label for="opponentSize">Opponent size</label> <label for="opponentSize">Opponent size</label>
@if (df['opponentSize'].invalid && (df['opponentSize'].dirty || df['opponentSize'].touched)) { @if (df['opponentSize'].invalid && (df['opponentSize'].dirty || !df['opponentSize'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (df['opponentSize'].hasError('required')) { @if (df['opponentSize'].hasError('required')) {
<p>Opponent size is required</p> <p>Opponent size is required</p>
@ -129,7 +129,7 @@
<input [ngClass]="{ <input [ngClass]="{
'is-valid': participant.get('weeklyPoints')?.valid, 'is-valid': participant.get('weeklyPoints')?.valid,
'is-invalid': participant.get('weeklyPoints')?.invalid && (participant.get('weeklyPoints')?.touched || participant.get('weeklyPoints')?.dirty) 'is-invalid': participant.get('weeklyPoints')?.invalid && (participant.get('weeklyPoints')?.touched || participant.get('weeklyPoints')?.dirty)
}" type="number" min="0" class="form-control form-control-sm" id="player{{i}}" formControlName="weeklyPoints"> }" mask="separator.2" thousandSeparator="." separatorLimit="9999999999999999" type="text" min="0" class="form-control form-control-sm" id="player{{i}}" formControlName="weeklyPoints">
@if (participant.get('weeklyPoints')?.invalid && (participant.get('weeklyPoints')?.touched || participant.get('weeklyPoints')?.dirty)) { @if (participant.get('weeklyPoints')?.invalid && (participant.get('weeklyPoints')?.touched || participant.get('weeklyPoints')?.dirty)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (participant.get('weeklyPoints')?.hasError('required')){ @if (participant.get('weeklyPoints')?.hasError('required')){

2
Ui/src/app/pages/vs-duel/vs-duel-edit/vs-duel-edit.component.ts
View File

@ -93,7 +93,7 @@ export class VsDuelEditComponent implements OnInit {
id: new FormControl<string>(vsDuelParticipant.id), id: new FormControl<string>(vsDuelParticipant.id),
playerId: new FormControl<string>(vsDuelParticipant.playerId), playerId: new FormControl<string>(vsDuelParticipant.playerId),
vsDuelId: new FormControl<string>(vsDuelParticipant.vsDuelId), vsDuelId: new FormControl<string>(vsDuelParticipant.vsDuelId),
weeklyPoints: new FormControl<number>(vsDuelParticipant.weeklyPoints, [Validators.required, Validators.pattern('(0|[1-9]\\d*)')]), weeklyPoints: new FormControl<number>(vsDuelParticipant.weeklyPoints, [Validators.required]),
playerName: new FormControl<string>(vsDuelParticipant.playerName), playerName: new FormControl<string>(vsDuelParticipant.playerName),
})); }));
}) })

8
Ui/src/app/pages/zombie-siege/zombie-siege.component.html
View File

@ -11,11 +11,11 @@
<form [formGroup]="zombieSiegeForm"> <form [formGroup]="zombieSiegeForm">
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['eventDate'].invalid && (f['eventDate'].dirty || f['eventDate'].touched), 'is-invalid': f['eventDate'].invalid && (f['eventDate'].dirty || !f['eventDate'].untouched),
'is-valid': f['eventDate'].valid}" 'is-valid': f['eventDate'].valid}"
type="date" class="form-control" id="eventDate" placeholder="eventDate" formControlName="eventDate"> type="date" class="form-control" id="eventDate" placeholder="eventDate" formControlName="eventDate">
<label for="level">eventDate</label> <label for="level">eventDate</label>
@if (f['eventDate'].invalid && (f['eventDate'].dirty || f['eventDate'].touched)) { @if (f['eventDate'].invalid && (f['eventDate'].dirty || !f['eventDate'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['eventDate'].hasError('required')) { @if (f['eventDate'].hasError('required')) {
<p>eventDate is required</p> <p>eventDate is required</p>
@ -25,11 +25,11 @@
</div> </div>
<div class="form-floating mb-3 is-invalid"> <div class="form-floating mb-3 is-invalid">
<input [ngClass]="{ <input [ngClass]="{
'is-invalid': f['level'].invalid && (f['level'].dirty || f['level'].touched), 'is-invalid': f['level'].invalid && (f['level'].dirty || !f['level'].untouched),
'is-valid': f['level'].valid}" 'is-valid': f['level'].valid}"
type="number" class="form-control" id="level" placeholder="level" formControlName="level"> type="number" class="form-control" id="level" placeholder="level" formControlName="level">
<label for="level">Level</label> <label for="level">Level</label>
@if (f['level'].invalid && (f['level'].dirty || f['level'].touched)) { @if (f['level'].invalid && (f['level'].dirty || !f['level'].untouched)) {
<div class="invalid-feedback"> <div class="invalid-feedback">
@if (f['level'].hasError('required')) { @if (f['level'].hasError('required')) {
<p>Level is required</p> <p>Level is required</p>