72 lines
2.1 KiB
HTML
72 lines
2.1 KiB
HTML
<h2
|
|
mat-dialog-title
|
|
class="text-xl md:text-2xl font-semibold text-gray-800 mb-3 md:mb-4"
|
|
>
|
|
Edit Qualification
|
|
</h2>
|
|
|
|
<mat-dialog-content class="!px-3 md:!px-6">
|
|
<form
|
|
[formGroup]="qualificationForm"
|
|
(ngSubmit)="edit()"
|
|
class="w-full min-w-[280px] md:min-w-[400px]"
|
|
>
|
|
<div class="space-y-4 md:space-y-6">
|
|
@if (apiErrorMessage) {
|
|
<div class="bg-red-50 p-3 md:p-4 rounded-lg border border-red-200">
|
|
<div class="flex items-start space-x-2 md:space-x-3">
|
|
<mat-icon class="text-red-600 text-xl md:text-2xl !w-8 !h-8"
|
|
>error</mat-icon
|
|
>
|
|
<div>
|
|
<p class="text-gray-800 font-medium text-sm md:text-base">
|
|
There was an error editing the qualification.
|
|
</p>
|
|
<p class="text-gray-600 mt-1 text-xs md:text-sm">
|
|
{{ apiErrorMessage }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
<div class="bg-gray-50 p-3 md:p-4 rounded-lg space-y-3">
|
|
<mat-form-field class="w-full">
|
|
<mat-label>Skill</mat-label>
|
|
<input
|
|
matInput
|
|
formControlName="skill"
|
|
placeholder="Enter skill name"
|
|
required
|
|
/>
|
|
<mat-hint class="text-sm">Enter the skill name</mat-hint>
|
|
<mat-error *ngIf="isFieldInvalid('skill')" class="text-sm">
|
|
{{ getErrorMessage("skill") }}
|
|
</mat-error>
|
|
</mat-form-field>
|
|
</div>
|
|
|
|
<mat-dialog-actions
|
|
align="end"
|
|
class="!px-0 !mb-0 flex flex-col sm:flex-row w-full gap-3"
|
|
>
|
|
<button
|
|
mat-button
|
|
mat-dialog-close
|
|
class="text-sm md:text-base hover:bg-gray-100 py-2 px-4 md:px-6 rounded-md w-full sm:flex-1"
|
|
>
|
|
Cancel
|
|
</button>
|
|
<button
|
|
mat-flat-button
|
|
color="primary"
|
|
type="submit"
|
|
class="!ml-0 text-sm md:text-base py-2 px-4 md:px-6 rounded-md w-full sm:flex-1"
|
|
>
|
|
Save Changes
|
|
</button>
|
|
</mat-dialog-actions>
|
|
</div>
|
|
</form>
|
|
</mat-dialog-content>
|