- Fixed rendering issues in Notes for Clients, Groups, and Centers - Removed unnecessary mat-list and mat-item usage - Improved UI consistency across entities
57 lines
1.8 KiB
HTML
57 lines
1.8 KiB
HTML
<div class="tab-container mat-typography">
|
|
<h3>{{ 'labels.heading.Notes' | translate }}</h3>
|
|
|
|
<div class="add-note-section">
|
|
<form
|
|
#formRef="ngForm"
|
|
[formGroup]="noteForm"
|
|
class="layout-row align-start-baseline gap-10px"
|
|
(ngSubmit)="addNote()"
|
|
>
|
|
<mat-form-field class="flex-85-minus-20px">
|
|
<textarea
|
|
required
|
|
formControlName="note"
|
|
matInput
|
|
placeholder="{{ 'labels.text.Write a note' | translate }} ..."
|
|
cdkTextareaAutosize
|
|
cdkAutosizeMinRows="2"
|
|
></textarea>
|
|
</mat-form-field>
|
|
<button mat-raised-button class="flex-1" color="primary" [disabled]="!noteForm.valid">
|
|
<fa-icon icon="plus" class="m-r-10"></fa-icon>{{ 'labels.buttons.Add' | translate }}
|
|
</button>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="notes-container">
|
|
<div *ngIf="entityNotes && entityNotes.length > 0; else emptyState">
|
|
<div class="note-card" *ngFor="let entityNote of entityNotes; let i = index">
|
|
<div class="note-content">
|
|
{{ entityNote.note }}
|
|
</div>
|
|
|
|
<div class="note-footer">
|
|
<div class="note-meta">
|
|
<div class="created-by">Created by {{ entityNote.createdByUsername }}</div>
|
|
<div class="created-date">
|
|
{{ entityNote.createdOn | dateFormat }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="note-actions">
|
|
<button class="edit-btn" (click)="editNote(entityNote.id, entityNote.note, i)" title="Edit note">
|
|
Edit
|
|
</button>
|
|
<button class="delete-btn" (click)="deleteNote(entityNote.id, i)" title="Delete note">Delete</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<ng-template #emptyState>
|
|
<div class="empty-state">No notes available</div>
|
|
</ng-template>
|
|
</div>
|
|
</div>
|