36 lines
1.8 KiB
HTML
36 lines
1.8 KiB
HTML
@if (notes) {
|
|
<div>
|
|
<form [formGroup]="noteForm" class="needs-validation mt-3" *pngxIfPermissions="{ action: PermissionAction.Add, type: PermissionType.Note }" novalidate>
|
|
<div class="form-group">
|
|
<textarea class="form-control form-control-sm" [class.is-invalid]="newNoteError" rows="3" formControlName="newNote" placeholder="Enter note" i18n-placeholder (keydown)="noteFormKeydown($event)" required></textarea>
|
|
<div class="invalid-feedback" i18n>
|
|
Please enter a note.
|
|
</div>
|
|
</div>
|
|
<div class="form-group mt-2 d-flex justify-content-end align-items-center">
|
|
@if (networkActive) {
|
|
<div class="spinner-border spinner-border-sm fw-normal me-auto" role="status"></div>
|
|
}
|
|
<button type="button" class="btn btn-primary btn-sm" [disabled]="networkActive || addDisabled" (click)="addNote()" i18n>Add note</button>
|
|
</div>
|
|
</form>
|
|
<hr>
|
|
@for (note of notes; track note) {
|
|
<div class="card border mb-3">
|
|
<div class="card-body text-dark">
|
|
<p class="card-text">{{note.note}}</p>
|
|
</div>
|
|
<div class="d-flex card-footer small bg-light text-primary justify-content-between align-items-center">
|
|
<span>{{displayName(note)}} - {{ note.created | customDate}}</span>
|
|
<button type="button" class="btn btn-link btn-sm p-0 fade" title="Delete note" i18n-title (click)="deleteNote(note.id)" *pngxIfPermissions="{ action: PermissionAction.Delete, type: PermissionType.Note }">
|
|
<svg width="13" height="13" fill="currentColor">
|
|
<use xlink:href="assets/bootstrap-icons.svg#trash" />
|
|
</svg>
|
|
<span class="visually-hidden" i18n>Delete note</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
}
|