From f159067692de356ee73b8663a4d1585b45a69d93 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Julian=20P=C3=B6mp?= Date: Thu, 30 Jan 2025 10:56:14 +0100 Subject: [PATCH] feat(octra): sort projects by name ascending --- .../projects-list.component.html | 95 +++++++++++++------ .../projects-list.component.scss | 16 +++- .../projects-list/projects-list.component.ts | 54 +++++------ apps/octra/src/app/core/shared/index.ts | 1 + .../src/app/core/shared/luxon-date.pipe.ts | 47 +++++++++ apps/octra/src/assets/i18n/de.json | 3 +- apps/octra/src/assets/i18n/en.json | 3 +- apps/octra/src/styles.scss | 4 + 8 files changed, 163 insertions(+), 60 deletions(-) create mode 100644 apps/octra/src/app/core/shared/luxon-date.pipe.ts diff --git a/apps/octra/src/app/core/pages/intern/projects-list/projects-list.component.html b/apps/octra/src/app/core/pages/intern/projects-list/projects-list.component.html index a71b94ac6..fee05d71e 100644 --- a/apps/octra/src/app/core/pages/intern/projects-list/projects-list.component.html +++ b/apps/octra/src/app/core/pages/intern/projects-list/projects-list.component.html @@ -38,48 +38,85 @@

{{ 'g.projects' | transloco }}

{{ 'projects-list.introduction' | transloco }}

- @if (projects?.list) { - - - - - - - - - - - - @for (project of projects?.list; track project) { - +
+
+
+
+ +
+
+
+ @for (project of shownProjects; track project) { +
+
-
- - - - - - } - -
{{ 'g.name' | transloco }}{{ 'g.description' | transloco }}{{ 'g.free tasks' | transloco }}{{ 'g.action' | transloco }}
+
@if (project.active) { } @if (!project.active) { } -
{{ project.name }}{{ project.public_description }}{{ getFreeAnnotationTasks(project) }} + +
+ {{ project.name }} ({{ project.shortname }}) +
+ +
+
+ {{ project.public_description }} +
+
+
+
+ + {{ 'g.free tasks' | transloco }}: + {{ getFreeAnnotationTasks(project) }} + + + @if (project.enddate) { + + + {{ 'p.available until' | transloco }}: + {{ + project.enddate + | luxonShortDateTime + : { + locale: (authStoreService.me$ | async).locale + } + }} + + } +
+
-
+
+ + + } + } @else {
{ - this.loadProjects(); + this.loadProjects(1); }, } ); - this.loadProjects(); + this.loadProjects(1); } - private loadProjects() { + loadProjects(page: number) { this.projects = undefined; this.subscribe( this.api.listProjects({ manageable: false, - start: 1, + start: page, representation: 'page', - length: 3, + order: "asc", + order_by: "name" }), { next: (projects) => { @@ -95,27 +105,7 @@ export class ProjectsListComponent extends DefaultComponent implements OnInit { return false; }), }; - - this.projects?.list?.sort((a, b) => { - if (a.active && !b.active) { - return 1; - } else if (a.active && b.active) { - const annotationStatisticsA = - a.statistics!.tasks.find((c) => c.type === 'annotation')?.status - .free ?? 0; - const annotationStatisticsB = - b.statistics!.tasks.find((c) => c.type === 'annotation')?.status - .free ?? 0; - - if (annotationStatisticsA > annotationStatisticsB) { - return 1; - } else if (annotationStatisticsA < annotationStatisticsB) { - return annotationStatisticsA === 0 ? -1 : 1; - } - return 0; - } - return -1; - }); + this.showProjects(page); }, error: (error: HttpErrorResponse) => { if (error.status === 401) { @@ -137,6 +127,14 @@ export class ProjectsListComponent extends DefaultComponent implements OnInit { ); } + showProjects(page: number) { + this.shownProjects = this.projects.list.slice((page - 1) * this.itemsPerPage, page * this.itemsPerPage); + this.currentPage = { + page, + collectionSize: this.projects.list.length + }; + } + onProjectClick(project: ProjectDto) { this.projectStarting = true; this.appStorage.startOnlineAnnotation(project); diff --git a/apps/octra/src/app/core/shared/index.ts b/apps/octra/src/app/core/shared/index.ts index 4398905ca..80575a359 100644 --- a/apps/octra/src/app/core/shared/index.ts +++ b/apps/octra/src/app/core/shared/index.ts @@ -5,4 +5,5 @@ export * from '../obj/statistics/KeyStatisticElem'; export * from '../obj/statistics/MouseStatisticElem'; export * from '../obj/statistics/StatisticElement'; export * from './functions'; +export * from './luxon-date.pipe'; export * from './Logger'; diff --git a/apps/octra/src/app/core/shared/luxon-date.pipe.ts b/apps/octra/src/app/core/shared/luxon-date.pipe.ts new file mode 100644 index 000000000..0bcdb854c --- /dev/null +++ b/apps/octra/src/app/core/shared/luxon-date.pipe.ts @@ -0,0 +1,47 @@ +import { Pipe, PipeTransform } from '@angular/core'; +import { DateTime } from 'luxon'; + +@Pipe({ + name: 'luxonShortDateTime', + standalone: true, +}) +export class LuxonShortDateTimePipe implements PipeTransform { + constructor() {} + + transform( + value: string | Date | DateTime | number | undefined, + options: { locale: string | undefined } + ): unknown { + if (!value) { + return ''; + } + + let dateTime: DateTime; + + if (value instanceof Date) { + dateTime = DateTime.fromJSDate(value); + } else if (value instanceof DateTime) { + dateTime = value; + } else if (typeof value === 'string') { + dateTime = DateTime.fromISO(value); + } else { + dateTime = DateTime.fromMillis(value); + } + + const loc = options.locale ?? 'en-GB'; + return dateTime.toLocaleString( + { + ...DateTime.DATETIME_SHORT, + day: '2-digit', + month: '2-digit', + year: '2-digit', + hour: '2-digit', + minute: '2-digit', + timeZoneName: 'short', + }, + { + locale: loc, + } + ); + } +} diff --git a/apps/octra/src/assets/i18n/de.json b/apps/octra/src/assets/i18n/de.json index 6026857ef..57dd75f77 100644 --- a/apps/octra/src/assets/i18n/de.json +++ b/apps/octra/src/assets/i18n/de.json @@ -419,7 +419,8 @@ "selected level": "Ausgewähltes level", "sign up": "Neu registrieren", "username or email": "Nutzername oder E-Mail", - "nothing found": "Nicht gefunden" + "nothing found": "Nicht gefunden", + "available until": "Verfügbar bis" }, "projects-list": { "introduction": "Wähle ein Projekt, für das Du transkribieren möchtest und klicke auf \"START\".", diff --git a/apps/octra/src/assets/i18n/en.json b/apps/octra/src/assets/i18n/en.json index a020617d8..5951a3013 100644 --- a/apps/octra/src/assets/i18n/en.json +++ b/apps/octra/src/assets/i18n/en.json @@ -419,7 +419,8 @@ "selected level": "Selected level", "sign up": "Sign up", "username or email": "Username or E-Mail", - "nothing found": "Nothing found" + "nothing found": "Nothing found", + "available until": "Available until" }, "projects-list": { "introduction": "Please select a project that you want to transcribe and click on \"START\".", diff --git a/apps/octra/src/styles.scss b/apps/octra/src/styles.scss index a9c3e5db8..93e9885f4 100644 --- a/apps/octra/src/styles.scss +++ b/apps/octra/src/styles.scss @@ -527,3 +527,7 @@ ngx-jodit { .version-popover { min-width: 300px; } + +ul.pagination.pagination-sm{ + margin-bottom: 0 !important; +}