Files
cbsnexora/src/app/shared/tabs/entity-notes-tab/entity-notes-tab.component.html
T
AnishaandGitHub 6f0f4f8eb5 (UI improved) Notes for Clients, Groups, Centers rendered properly (#2633)
- Fixed rendering issues in Notes for Clients, Groups, and Centers
- Removed unnecessary mat-list and mat-item usage
- Improved UI consistency across entities
2025-09-04 10:48:54 -06:00

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>