diff --git a/docs/assets/screenshots/dashboard.png b/docs/assets/screenshots/dashboard.png index 41fe23ffc..eded2135f 100644 Binary files a/docs/assets/screenshots/dashboard.png and b/docs/assets/screenshots/dashboard.png differ diff --git a/src-ui/messages.xlf b/src-ui/messages.xlf index ce470a9a4..edc2926ae 100644 --- a/src-ui/messages.xlf +++ b/src-ui/messages.xlf @@ -2202,20 +2202,48 @@ 1 - - Documents in inbox: - - src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html - 3 - - - - Total documents: + + Go to inbox src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html 4 + + Documents in inbox + + src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html + 5 + + + + Go to documents + + src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html + 8 + + + + Total documents + + src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html + 9 + + + + Total characters + + src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html + 13 + + + + Other + + src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.ts + 87 + + Upload new documents diff --git a/src-ui/package-lock.json b/src-ui/package-lock.json index 38c6d0664..6df75ac5c 100644 --- a/src-ui/package-lock.json +++ b/src-ui/package-lock.json @@ -22,6 +22,7 @@ "@popperjs/core": "^2.11.6", "bootstrap": "^5.2.3", "file-saver": "^2.0.5", + "mime-names": "^1.0.0", "ng2-pdf-viewer": "^9.1.2", "ngx-color": "^8.0.3", "ngx-cookie-service": "^15.0.0", @@ -13766,6 +13767,11 @@ "node": ">= 0.6" } }, + "node_modules/mime-names": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/mime-names/-/mime-names-1.0.0.tgz", + "integrity": "sha512-vLNEfYU63fz34panv/L3Lh3eW3+v0BlOB+bSGFdntv/gBNnokCbSsaNuHR9vH/NS5oWbL0HqMQf/3we4fRJyIQ==" + }, "node_modules/mime-types": { "version": "2.1.35", "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz", diff --git a/src-ui/package.json b/src-ui/package.json index 8ec1b80ab..934011a5b 100644 --- a/src-ui/package.json +++ b/src-ui/package.json @@ -27,6 +27,7 @@ "@popperjs/core": "^2.11.6", "bootstrap": "^5.2.3", "file-saver": "^2.0.5", + "mime-names": "^1.0.0", "ng2-pdf-viewer": "^9.1.2", "ngx-color": "^8.0.3", "ngx-cookie-service": "^15.0.0", diff --git a/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html b/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html index 5bba41a4d..ec6e239d0 100644 --- a/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html +++ b/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html @@ -1,6 +1,46 @@ - Documents in inbox: {{statistics?.documents_inbox}} - Total documents: {{statistics?.documents_total}} + + + Documents in inbox: + 0" [class.bg-muted]="statistics?.documents_inbox === 0">{{statistics?.documents_inbox}} + + + Total documents: + {{statistics?.documents_total}} + + + Total characters: + {{statistics?.character_count | number}} + + 1" class="list-group-item filetypes"> + + + + + + + + + + + {{ getFileTypeExtension(filetype) }} ({{getFileTypePercent(filetype) | number: '1.0-1'}}%) + + + + + diff --git a/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.scss b/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.scss index e69de29bb..bb2bc5b4f 100644 --- a/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.scss +++ b/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.scss @@ -0,0 +1,10 @@ +.filetypes { + .progress { + height: 0.6rem; + } + + .badge { + height: 0.6rem; + width: 0.6rem; + } +} diff --git a/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.ts b/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.ts index 3d9f7b5e7..d1de799c1 100644 --- a/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.ts +++ b/src-ui/src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.ts @@ -1,12 +1,23 @@ import { HttpClient } from '@angular/common/http' import { Component, OnDestroy, OnInit } from '@angular/core' import { Observable, Subscription } from 'rxjs' +import { FILTER_HAS_TAGS_ALL } from 'src/app/data/filter-rule-type' import { ConsumerStatusService } from 'src/app/services/consumer-status.service' +import { DocumentListViewService } from 'src/app/services/document-list-view.service' import { environment } from 'src/environments/environment' +import * as mimeTypeNames from 'mime-names' export interface Statistics { documents_total?: number documents_inbox?: number + inbox_tag?: number + document_file_type_counts?: DocumentFileType[] + character_count?: number +} + +interface DocumentFileType { + mime_type: string + mime_type_count: number } @Component({ @@ -19,7 +30,8 @@ export class StatisticsWidgetComponent implements OnInit, OnDestroy { constructor( private http: HttpClient, - private consumerStatusService: ConsumerStatusService + private consumerStatusService: ConsumerStatusService, + private documentListViewService: DocumentListViewService ) {} statistics: Statistics = {} @@ -34,10 +46,43 @@ export class StatisticsWidgetComponent implements OnInit, OnDestroy { this.loading = true this.getStatistics().subscribe((statistics) => { this.loading = false + const fileTypeMax = 5 + if (statistics.document_file_type_counts?.length > fileTypeMax) { + const others = statistics.document_file_type_counts.slice(fileTypeMax) + statistics.document_file_type_counts = + statistics.document_file_type_counts.slice(0, fileTypeMax) + statistics.document_file_type_counts.push({ + mime_type: $localize`Other`, + mime_type_count: others.reduce( + (currentValue, documentFileType) => + documentFileType.mime_type_count + currentValue, + 0 + ), + }) + } this.statistics = statistics }) } + getFileTypeExtension(filetype: DocumentFileType): string { + return ( + mimeTypeNames[filetype.mime_type]?.extensions[0]?.toUpperCase() ?? + filetype.mime_type + ) + } + + getFileTypeName(filetype: DocumentFileType): string { + return mimeTypeNames[filetype.mime_type]?.name ?? filetype.mime_type + } + + getFileTypePercent(filetype: DocumentFileType): number { + return (filetype.mime_type_count / this.statistics?.documents_total) * 100 + } + + getItemOpacity(i: number): number { + return 1 - i / this.statistics?.document_file_type_counts.length + } + ngOnInit(): void { this.reload() this.subscription = this.consumerStatusService @@ -50,4 +95,13 @@ export class StatisticsWidgetComponent implements OnInit, OnDestroy { ngOnDestroy(): void { this.subscription.unsubscribe() } + + goToInbox() { + this.documentListViewService.quickFilter([ + { + rule_type: FILTER_HAS_TAGS_ALL, + value: this.statistics.inbox_tag.toString(), + }, + ]) + } } diff --git a/src-ui/src/styles.scss b/src-ui/src/styles.scss index e5a69361f..63fa58028 100644 --- a/src-ui/src/styles.scss +++ b/src-ui/src/styles.scss @@ -629,3 +629,7 @@ code { .accordion-button::after { filter: invert(0.5) saturate(0); } + +.me-1px { + margin-right: 1px !important; +} diff --git a/src-ui/src/theme.scss b/src-ui/src/theme.scss index 92b078994..a53c098f6 100644 --- a/src-ui/src/theme.scss +++ b/src-ui/src/theme.scss @@ -231,6 +231,14 @@ $form-check-radio-checked-bg-image-dark: url("data:image/svg+xml,
Documents in inbox: {{statistics?.documents_inbox}}
Total documents: {{statistics?.documents_total}}