mirror of
https://github.com/paperless-ngx/paperless-ngx.git
synced 2025-12-11 09:07:18 +01:00
- Created AIStatus data model with TypeScript interfaces - Implemented AIStatusService with polling mechanism - Created AIStatusIndicatorComponent with icon, tooltip, and animations - Added component to navbar between notifications and user menu - Includes unit tests for service and component - Shows AI active/inactive state with visual indicators - Displays statistics: documents scanned, suggestions applied - Shows pending deletion requests with badge - Processing animation when AI is active - Link to AI configuration settings - Non-intrusive design following existing patterns Co-authored-by: dawnsystem <42047891+dawnsystem@users.noreply.github.com>
77 lines
2.4 KiB
HTML
77 lines
2.4 KiB
HTML
<li class="nav-item ai-status-container">
|
|
<button
|
|
class="btn border-0 position-relative"
|
|
[ngbPopover]="aiStatusPopover"
|
|
popoverClass="ai-status-popover"
|
|
placement="bottom"
|
|
container="body"
|
|
triggers="mouseenter:mouseleave">
|
|
<i-bs
|
|
width="1.3em"
|
|
height="1.3em"
|
|
[name]="iconName"
|
|
[class]="iconClass">
|
|
</i-bs>
|
|
@if (hasAlerts) {
|
|
<span class="badge rounded-pill bg-danger position-absolute top-0 end-0 translate-middle-y">
|
|
{{ aiStatus.pending_deletion_requests }}
|
|
</span>
|
|
}
|
|
</button>
|
|
</li>
|
|
|
|
<ng-template #aiStatusPopover>
|
|
<div class="ai-status-tooltip">
|
|
<h6 class="mb-2 border-bottom pb-2">
|
|
<i-bs name="robot" width="1em" height="1em" class="me-1"></i-bs>
|
|
<span i18n>AI Scanner Status</span>
|
|
</h6>
|
|
|
|
<div class="status-info">
|
|
<div class="status-row mb-2">
|
|
<span class="status-label" i18n>Status:</span>
|
|
<span [class]="aiStatus.active ? 'text-success' : 'text-muted'">
|
|
{{ aiStatus.active ? 'Active' : 'Inactive' }}
|
|
@if (aiStatus.processing) {
|
|
<span class="badge bg-primary ms-1" i18n>Processing</span>
|
|
}
|
|
</span>
|
|
</div>
|
|
|
|
@if (aiStatus.active) {
|
|
<div class="status-row mb-2">
|
|
<span class="status-label" i18n>Scanned Today:</span>
|
|
<span class="fw-bold">{{ aiStatus.documents_scanned_today }}</span>
|
|
</div>
|
|
|
|
<div class="status-row mb-2">
|
|
<span class="status-label" i18n>Suggestions Applied:</span>
|
|
<span class="fw-bold">{{ aiStatus.suggestions_applied }}</span>
|
|
</div>
|
|
|
|
@if (aiStatus.pending_deletion_requests > 0) {
|
|
<div class="status-row mb-2">
|
|
<span class="status-label text-danger" i18n>Pending Deletions:</span>
|
|
<span class="fw-bold text-danger">{{ aiStatus.pending_deletion_requests }}</span>
|
|
</div>
|
|
}
|
|
|
|
@if (aiStatus.last_scan) {
|
|
<div class="status-row mb-2 small text-muted">
|
|
<span class="status-label" i18n>Last Scan:</span>
|
|
<span>{{ aiStatus.last_scan | date: 'short' }}</span>
|
|
</div>
|
|
}
|
|
}
|
|
</div>
|
|
|
|
<div class="mt-3 pt-2 border-top">
|
|
<button
|
|
class="btn btn-sm btn-outline-primary w-100"
|
|
(click)="navigateToSettings()"
|
|
i18n>
|
|
Configure AI Scanner
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</ng-template>
|