hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-07 01:54:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

add new component, add mock, refactor

Browse Source
This commit is contained in:
FrancescoMolinaro
2023-12-22 17:26:46 +01:00
parent 604fb4f3d1
commit 5d8ba54676
16 changed files with 131 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/admin/admin-notify-dashboard/admin-notify-dashboard-routing.module.ts
View File

@@ -2,8 +2,8 @@ import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { I18nBreadcrumbResolver } from '../../core/breadcrumbs/i18n-breadcrumb.resolver';
import { I18nBreadcrumbsService } from '../../core/breadcrumbs/i18n-breadcrumbs.service';
import { AuthenticatedGuard } from "../../core/auth/authenticated.guard";
import { AdminNotifyDashboardComponent } from "./admin-notify-dashboard.component";
import { AuthenticatedGuard } from '../../core/auth/authenticated.guard';
import { AdminNotifyDashboardComponent } from './admin-notify-dashboard.component';
@NgModule({
imports: [

3
src/app/admin/admin-notify-dashboard/admin-notify-dashboard.component.spec.ts
View File

@@ -1,6 +1,8 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AdminNotifyDashboardComponent } from './admin-notify-dashboard.component';
import { TranslateModule } from '@ngx-translate/core';
import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap';
describe('AdminNotifyDashboardComponent', () => {
let component: AdminNotifyDashboardComponent;
@@ -8,6 +10,7 @@ describe('AdminNotifyDashboardComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [TranslateModule.forRoot(), NgbNavModule],
declarations: [ AdminNotifyDashboardComponent ]
})
.compileComponents();

43
src/app/admin/admin-notify-dashboard/admin-notify-dashboard.component.ts
View File

@@ -1,10 +1,47 @@
import { Component } from '@angular/core';
import { Component, Inject, OnInit } from '@angular/core';
import { SearchConfigurationService } from "../../core/shared/search/search-configuration.service";
import { SearchService } from "../../core/shared/search/search.service";
import { PaginatedSearchOptions } from "../../shared/search/models/paginated-search-options.model";
import { SEARCH_CONFIG_SERVICE } from "../../my-dspace-page/my-dspace-page.component";
import { PaginationComponentOptions } from "../../shared/pagination/pagination-component-options.model";
import { SearchFilterConfig } from "../../shared/search/models/search-filter-config.model";
@Component({
selector: 'ds-admin-notify-dashboard',
templateUrl: './admin-notify-dashboard.component.html',
styleUrls: ['./admin-notify-dashboard.component.scss']
styleUrls: ['./admin-notify-dashboard.component.scss'],
providers: [
{
provide: SEARCH_CONFIG_SERVICE,
useClass: SearchConfigurationService
}
]
})
export class AdminNotifyDashboardComponent {
export class AdminNotifyDashboardComponent implements OnInit{
mockFilterConfig : SearchFilterConfig = Object.assign(new SearchFilterConfig(), {
type: {
value: "discovery-filter"
},
pageSize: 10,
name: "author",
filterType: "text",
_links: {
self: {
href: "https://dspace-coar.4science.cloud/server/api/discover/facets/author"
}
}
});
mockPaginatedSearchOptions = new PaginatedSearchOptions({
pagination: Object.assign(new PaginationComponentOptions(), { id: 'page-id', currentPage: 1, pageSize: 20 }),
configuration: '',
});
constructor(private searchService: SearchService,
@Inject(SEARCH_CONFIG_SERVICE) public searchConfigService: SearchConfigurationService,
) {}
ngOnInit() {
this.searchService.getFacetValuesFor(this.mockFilterConfig, 1, this.mockPaginatedSearchOptions).subscribe(c => console.log(c))
}
}

11
src/app/admin/admin-notify-dashboard/admin-notify-dashboard.module.ts
View File

@@ -1,18 +1,19 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
import { SharedModule } from '../../shared/shared.module';
import { AdminNotifyDashboardComponent } from "./admin-notify-dashboard.component";
import { AdminNotifyDashboardRoutingModule } from "./admin-notify-dashboard-routing.module";
import { AdminNotifyDashboardComponent } from './admin-notify-dashboard.component';
import { AdminNotifyDashboardRoutingModule } from './admin-notify-dashboard-routing.module';
import { AdminNotifyMetricsComponent } from './admin-notify-metrics/admin-notify-metrics.component';
import { AdminNotifyLogsComponent } from './admin-notify-logs/admin-notify-logs.component';
import { SharedModule } from '../../shared/shared.module';
@NgModule({
imports: [
CommonModule,
SharedModule,
RouterModule,
AdminNotifyDashboardRoutingModule,
SharedModule,
AdminNotifyDashboardRoutingModule
],
declarations: [
AdminNotifyDashboardComponent,

2
src/app/admin/admin-notify-dashboard/admin-notify-logs/admin-notify-logs.component.spec.ts
View File

@@ -1,6 +1,7 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AdminNotifyLogsComponent } from './admin-notify-logs.component';
import { TranslateModule } from '@ngx-translate/core';
describe('AdminNotifyLogsComponent', () => {
let component: AdminNotifyLogsComponent;
@@ -8,6 +9,7 @@ describe('AdminNotifyLogsComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [TranslateModule.forRoot()],
declarations: [ AdminNotifyLogsComponent ]
})
.compileComponents();

14
src/app/admin/admin-notify-dashboard/admin-notify-metrics/admin-notify-metrics.component.html
View File

@@ -1,11 +1,9 @@
<div class="container-fluid">
<div *ngFor="let rows of boxesConfig">
<div *ngFor="let box of rows.boxes">
<div [ngStyle]="{'background-color': box.color}">
<!--Here will go the actual count coming from the REST endpoint -->
<div>0</div>
<div>{{ box.title | translate }}</div>
</div>
<div class="mb-5" *ngFor="let row of boxesConfig">
<div class="mb-2">{{ row.title | translate }}</div>
<div class="row justify-content-between">
<div class="col-sm" *ngFor="let box of row.boxes">
<ds-notification-box [boxConfig]="box"></ds-notification-box>
</div>
</div>
</div>

2
src/app/admin/admin-notify-dashboard/admin-notify-metrics/admin-notify-metrics.component.spec.ts
View File

@@ -1,6 +1,7 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AdminNotifyMetricsComponent } from './admin-notify-metrics.component';
import { TranslateModule } from '@ngx-translate/core';
describe('AdminNotifyMetricsComponent', () => {
let component: AdminNotifyMetricsComponent;
@@ -8,6 +9,7 @@ describe('AdminNotifyMetricsComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [TranslateModule.forRoot()],
declarations: [ AdminNotifyMetricsComponent ]
})
.compileComponents();

4
src/app/admin/admin-notify-dashboard/admin-notify-metrics/admin-notify-metrics.component.ts
View File

@@ -1,6 +1,6 @@
import { Component } from '@angular/core';
import { AdminNotifyMetricsRow } from "./admin-notify-metrics.model";
import { AdminNotifyMetricsRowsConfig } from "./admin-notify-metrics.config";
import { AdminNotifyMetricsRow } from './admin-notify-metrics.model';
import { AdminNotifyMetricsRowsConfig } from './admin-notify-metrics.config';
@Component({
selector: 'ds-admin-notify-metrics',

36
src/app/admin/admin-notify-dashboard/admin-notify-metrics/admin-notify-metrics.config.ts
View File

@@ -1,33 +1,29 @@
import { AdminNotifyMetricsRow } from "./admin-notify-metrics.model";
import { AdminNotifyMetricsRow } from './admin-notify-metrics.model';
export const AdminNotifyMetricsRowsConfig: AdminNotifyMetricsRow[] = [
{
title: 'Number of received LDN',
boxes: [
{
color: 'blue',
color: '#B8DAFF',
title: 'Accepted',
index: 0
},
{
color: 'green',
color: '#D4EDDA',
title: 'Processed LDN',
index: 1
},
{
color: 'red',
color: '#FDBBC7',
title: 'Failure',
index: 2
},
{
color: 'red',
color: '#FDBBC7',
title: 'Untrusted',
index: 3
},
{
color: 'grey',
color: '#43515F',
title: 'Incoming LDM messages',
index: 4
textColor: '#fff'
},
]
},
@@ -35,30 +31,26 @@ export const AdminNotifyMetricsRowsConfig: AdminNotifyMetricsRow[] = [
title: 'Number of generated LDN',
boxes: [
{
color: 'green',
color: '#D4EDDA',
title: 'Delivered',
index: 0
},
{
color: 'blue',
color: '#B8DAFF',
title: 'Queued',
index: 1
},
{
color: 'yellow',
color: '#FDEEBB',
title: 'Queued for retry',
index: 2
},
{
color: 'red',
color: '#FDBBC7',
title: 'Failure',
index: 3
},
{
color: 'grey',
color: '#43515F',
title: 'Outgoing LDM messages',
index: 4
textColor: '#fff'
},
]
}
]
];

3
src/app/admin/admin-notify-dashboard/admin-notify-metrics/admin-notify-metrics.model.ts
View File

@@ -1,7 +1,8 @@
export interface AdminNotifyMetricsBox {
color: string;
textColor?: string;
title: string;
index: number
count?: number
}
export interface AdminNotifyMetricsRow {

1
src/app/admin/admin-routing.module.ts
View File

@@ -13,7 +13,6 @@ import {
NOTIFY_DASHBOARD_MODULE_PATH
} from './admin-routing-paths';
import { BatchImportPageComponent } from './admin-import-batch-page/batch-import-page.component';
import { AdminNotifyDashboardComponent } from "./admin-notify-dashboard/admin-notify-dashboard.component";
@NgModule({
imports: [

6
src/app/shared/notification-box/notification-box.component.html Normal file
View File

@@ -0,0 +1,6 @@
<div class="w-100 h-100 pt-4 pb-3 px-2 box-container" [ngStyle]="{'background-color': boxConfig.color}">
<div [ngStyle]="{'color': boxConfig.textColor}" class="d-flex flex-column justify-content-center align-items-center">
<div class="mb-4 font-weight-bold box-counter">{{ boxConfig.count ?? 0 }}</div>
<div class="font-weight-bold d-flex justify-content-center w-100">{{ boxConfig.title | translate }}</div>
</div>
</div>

7
src/app/shared/notification-box/notification-box.component.scss Normal file
View File

@@ -0,0 +1,7 @@
.box-container {
min-width: max-content;
}
.box-counter {
font-size: calc(var(--bs-font-size-lg) * 1.5);
}

23
src/app/shared/notification-box/notification-box.component.spec.ts Normal file
View File

@@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { NotificationBoxComponent } from './notification-box.component';
describe('NotificationBoxComponent', () => {
let component: NotificationBoxComponent;
let fixture: ComponentFixture<NotificationBoxComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ NotificationBoxComponent ]
})
.compileComponents();
fixture = TestBed.createComponent(NotificationBoxComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

13
src/app/shared/notification-box/notification-box.component.ts Normal file
View File

@@ -0,0 +1,13 @@
import { Component, Input } from '@angular/core';
import {
AdminNotifyMetricsBox
} from "../../admin/admin-notify-dashboard/admin-notify-metrics/admin-notify-metrics.model";
@Component({
selector: 'ds-notification-box',
templateUrl: './notification-box.component.html',
styleUrls: ['./notification-box.component.scss']
})
export class NotificationBoxComponent {
@Input() boxConfig: AdminNotifyMetricsBox;
}

4
src/app/shared/shared.module.ts
View File

@@ -285,6 +285,7 @@ import { NgxPaginationModule } from 'ngx-pagination';
import { SplitPipe } from './utils/split.pipe';
import { ThemedUserMenuComponent } from './auth-nav-menu/user-menu/themed-user-menu.component';
import { ThemedLangSwitchComponent } from './lang-switch/themed-lang-switch.component';
import { NotificationBoxComponent } from './notification-box/notification-box.component';
const MODULES = [
CommonModule,
@@ -469,7 +470,8 @@ const ENTRY_COMPONENTS = [
AdvancedClaimedTaskActionRatingComponent,
EpersonGroupListComponent,
EpersonSearchBoxComponent,
GroupSearchBoxComponent
GroupSearchBoxComponent,
NotificationBoxComponent
];
const PROVIDERS = [