angular/ems-frontend
angular/ems-frontend
Archived
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Style

Browse Source
This commit is contained in:
Phan Huy Tran 2025-01-08 10:56:27 +01:00
parent 3d1750ecec
commit daa7af73a4
2 changed files with 31 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/app/create-qualification/create-qualification.component.html
View File

@ -1,22 +1,20 @@
<!-- create-qualification.component.html --> <h2 mat-dialog-title>Create Qualification</h2>
<form [formGroup]="qualificationForm" (ngSubmit)="create()" class="space-y-4"> <mat-dialog-content>
<div> <form [formGroup]="qualificationForm" (ngSubmit)="create()">
<label for="skill-input" class="block mb-1">Skill</label> <div class="!space-y-4">
<input <mat-form-field class="!w-full">
id="skill-input" <mat-label>Skill</mat-label>
type="text" <input matInput
formControlName="skill" formControlName="skill"
class="w-full p-2 border rounded" required>
[ngClass]="{'border-red-500 focus:ring-0 focus:outline-none': isFieldInvalid('skill')}"> <mat-error *ngIf="isFieldInvalid('skill')">
{{ getErrorMessage('skill') }}
</mat-error>
</mat-form-field>
<div <mat-dialog-actions align="end">
*ngIf="isFieldInvalid('skill')" <button mat-flat-button color="primary" type="submit">Create</button>
class="text-sm text-red-500 mt-1"> </mat-dialog-actions>
{{ getErrorMessage('skill') }}
</div> </div>
</div> </form>
</mat-dialog-content>
<button type="submit">
Create
</button>
</form>

16
src/app/create-qualification/create-qualification.component.ts
View File

@ -1,15 +1,25 @@
import {Component, inject} from '@angular/core'; import {Component, inject} from '@angular/core';
import {FormBuilder, ReactiveFormsModule, Validators} from "@angular/forms"; import {FormBuilder, ReactiveFormsModule, Validators} from "@angular/forms";
import QualificationService from "../services/qualification.service"; import QualificationService from "../services/qualification.service";
import {MatDialogRef} from "@angular/material/dialog"; import {MatDialogActions, MatDialogContent, MatDialogRef, MatDialogTitle} from "@angular/material/dialog";
import {NgClass, NgIf} from "@angular/common"; import {NgClass, NgIf} from "@angular/common";
import {MatError, MatFormField, MatLabel} from "@angular/material/form-field";
import {MatButton} from "@angular/material/button";
import {MatInput} from "@angular/material/input";
@Component({ @Component({
selector: 'app-create-qualification', selector: 'app-create-qualification',
imports: [ imports: [
ReactiveFormsModule, ReactiveFormsModule,
NgClass, MatError,
NgIf NgIf,
MatLabel,
MatDialogTitle,
MatDialogContent,
MatFormField,
MatDialogActions,
MatButton,
MatInput
], ],
templateUrl: './create-qualification.component.html', templateUrl: './create-qualification.component.html',
styleUrl: './create-qualification.component.css' styleUrl: './create-qualification.component.css'