Marmelator/red-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1.4k Wiki Activity

RED-3796: Dashboard #2 (empty dossier template)

Browse Source
This commit is contained in:
Adina Țeudan 2022-04-20 00:45:14 +03:00
parent a11d02f126
commit 127b77dceb
11 changed files with 104 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.html
View File

@ -6,7 +6,19 @@
<!-- <div>stats2</div>-->
<div class="empty">
<div>nothing here</div>
<div>btn</div>
<div class="text-muted">
<div class="heading mb-8">
{{ dossierTemplate.name }}
</div>
<div>
{{ 'dashboard.empty-template.description' | translate }}
</div>
</div>
<iqser-icon-button
(action)="newDossier()"
[label]="'dashboard.empty-template.new-dossier' | translate"
[type]="iconButtonTypes.primary"
icon="iqser:plus"
></iqser-icon-button>
</div>
</div>

1
apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.scss
View File

@ -1,6 +1,7 @@
.dialog {
flex-direction: row;
max-width: unset;
margin: 0 0 16px 0;
> div {
padding: 24px;

13
apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.ts
View File

@ -1,9 +1,12 @@
import { ChangeDetectionStrategy, Component, Input, OnChanges } from '@angular/core';
import { DossierTemplatesService } from '../../../../services/entity-services/dossier-templates.service';
import { DossierTemplatesService } from '@services/entity-services/dossier-templates.service';
import { DossierTemplate, DossierTemplateStats } from '@red/domain';
import { BehaviorSubject, Observable } from 'rxjs';
import { switchMap } from 'rxjs/operators';
import { DossierTemplateStatsService } from '@services/entity-services/dossier-template-stats.service';
import { IconButtonTypes } from '@iqser/common-ui';
import { DossiersDialogService } from '../../../dossier/services/dossiers-dialog.service';
import { Router } from '@angular/router';
@Component({
selector: 'redaction-template-stats [dossierTemplateId]',
@ -12,6 +15,8 @@ import { DossierTemplateStatsService } from '@services/entity-services/dossier-t
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class TemplateStatsComponent implements OnChanges {
readonly iconButtonTypes = IconButtonTypes;
@Input() dossierTemplateId: string;
readonly dossierTemplate$: Observable<DossierTemplate>;
@ -21,6 +26,8 @@ export class TemplateStatsComponent implements OnChanges {
constructor(
private readonly _dossierTemplatesService: DossierTemplatesService,
private readonly _dossierTemplateStatsService: DossierTemplateStatsService,
private readonly _dialogService: DossiersDialogService,
private readonly _router: Router,
) {
this.dossierTemplate$ = this.#ngOnChanges$.pipe(switchMap(id => this._dossierTemplatesService.getEntityChanged$(id)));
this.stats$ = this.#ngOnChanges$.pipe(switchMap(id => this._dossierTemplateStatsService.watch$(id)));
@ -31,4 +38,8 @@ export class TemplateStatsComponent implements OnChanges {
this.#ngOnChanges$.next(this.dossierTemplateId);
}
}
newDossier(): void {
this._dialogService.openDialog('addDossier', null, { dossierTemplateId: this.dossierTemplateId });
}
}

8
apps/red-ui/src/app/modules/dashboard/dashboard-screen/dashboard-screen.component.html
View File

@ -1,9 +1,13 @@
<div class="overlay-shadow"></div>
<div class="container">
<h2 [translateParams]="{ name: currentUser.firstName || currentUser.name }" [translate]="'dashboard.greeting.title'"></h2>
<div
[translateParams]="{ name: currentUser.firstName || currentUser.name }"
[translate]="'dashboard.greeting.title'"
class="heading-xl mb-8"
></div>
<p translate="dashboard.greeting.subtitle"></p>
<div class="mb-32" translate="dashboard.greeting.subtitle"></div>
<redaction-template-stats
*ngFor="let dossierTemplate of dossierTemplatesService.all$ | async"

3
apps/red-ui/src/app/modules/dashboard/dashboard.module.ts
View File

@ -6,6 +6,7 @@ import { SharedModule } from '../shared/shared.module';
import { TemplateStatsComponent } from './components/template-stats/template-stats.component';
import { DossierTemplatesGuard } from '../../guards/dossier-templates.guard';
import { CompositeRouteGuard } from '@iqser/common-ui';
import { SharedDossiersModule } from '../dossier/shared/shared-dossiers.module';
const routes = [
{
@ -18,6 +19,6 @@ const routes = [
@NgModule({
declarations: [DashboardScreenComponent, TemplateStatsComponent],
imports: [RouterModule.forChild(routes), CommonModule, SharedModule],
imports: [RouterModule.forChild(routes), CommonModule, SharedModule, SharedDossiersModule],
})
export class DashboardModule {}

29
apps/red-ui/src/app/modules/dossier/dialogs/add-dossier-dialog/add-dossier-dialog.component.ts
View File

@ -1,15 +1,21 @@
import { Component, Injector } from '@angular/core';
import { MatDialogRef } from '@angular/material/dialog';
import { Component, Inject, Injector } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { DownloadFileType, IDossierRequest, IDossierTemplate, IReportTemplate } from '@red/domain';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { downloadTypesTranslations } from '../../../../translations/download-types-translations';
import { BaseDialogComponent, IconButtonTypes, SaveOptions } from '@iqser/common-ui';
import { BaseDialogComponent, IconButtonTypes, LoadingService, SaveOptions } from '@iqser/common-ui';
import { ActiveDossiersService } from '@services/dossiers/active-dossiers.service';
import { DossierTemplatesService } from '@services/entity-services/dossier-templates.service';
import { ReportTemplateService } from '@services/report-template.service';
import { firstValueFrom } from 'rxjs';
import { DOSSIER_TEMPLATE_ID } from '@utils/constants';
import dayjs from 'dayjs';
import { Router } from '@angular/router';
import { DossiersDialogService } from '../../services/dossiers-dialog.service';
interface DialogData {
readonly dossierTemplateId?: string;
}
@Component({
templateUrl: './add-dossier-dialog.component.html',
@ -33,8 +39,12 @@ export class AddDossierDialogComponent extends BaseDialogComponent {
private readonly _dossierTemplatesService: DossierTemplatesService,
private readonly _formBuilder: FormBuilder,
private readonly _reportTemplateController: ReportTemplateService,
private readonly _router: Router,
private readonly _dialogService: DossiersDialogService,
private readonly _loadingService: LoadingService,
protected readonly _injector: Injector,
protected readonly _dialogRef: MatDialogRef<AddDossierDialogComponent>,
@Inject(MAT_DIALOG_DATA) readonly data: DialogData,
) {
super(_injector, _dialogRef);
this._getDossierTemplates();
@ -61,10 +71,19 @@ export class AddDossierDialogComponent extends BaseDialogComponent {
reportTemplateValueMapper = (reportTemplate: IReportTemplate) => reportTemplate.templateId;
async save(options?: SaveOptions) {
this._loadingService.start();
const savedDossier = await firstValueFrom(this._activeDossiersService.createOrUpdate(this._formToObject()));
if (savedDossier) {
this._dialogRef.close({ dossier: savedDossier, addMembers: options?.addMembers });
await this._router.navigate([savedDossier.routerLink]);
if (options?.addMembers) {
this._dialogService.openDialog('editDossier', null, {
dossierId: savedDossier.dossierId,
section: 'members',
});
}
this._dialogRef.close(savedDossier);
}
this._loadingService.stop();
}
async dossierTemplateChanged(dossierTemplateId) {
@ -98,7 +117,7 @@ export class AddDossierDialogComponent extends BaseDialogComponent {
return this._formBuilder.group(
{
dossierName: [null, Validators.required],
dossierTemplateId: [null, Validators.required],
dossierTemplateId: [this.data?.dossierTemplateId, Validators.required],
downloadFileTypes: [null],
reportTemplateIds: [null],
description: [null],

28
apps/red-ui/src/app/modules/dossiers-listing/config.service.ts
View File

@ -6,11 +6,12 @@ import { TranslateService } from '@ngx-translate/core';
import { UserPreferenceService } from '@services/user-preference.service';
import { UserService } from '@services/user.service';
import { workflowFileStatusTranslations } from '../../translations/file-status-translations';
import { dossierMemberChecker, dossierStateChecker, dossierTemplateChecker, RedactionFilterSorter } from '@utils/index';
import { dossierMemberChecker, dossierStateChecker, dossierTemplateChecker, RedactionFilterSorter } from '../../utils';
import { workloadTranslations } from '../dossier/translations/workload-translations';
import { DossierTemplatesService } from '@services/entity-services/dossier-templates.service';
import { DossierStatsService } from '@services/dossiers/dossier-stats.service';
import { DossierStatesMapService } from '@services/entity-services/dossier-states-map.service';
import { DossiersDialogService } from '../dossier/services/dossiers-dialog.service';
@Injectable()
export class ConfigService {
@ -21,6 +22,7 @@ export class ConfigService {
private readonly _dossierTemplatesService: DossierTemplatesService,
private readonly _dossierStatsService: DossierStatsService,
private readonly _dossierStatesMapService: DossierStatesMapService,
private readonly _dialogService: DossiersDialogService,
) {}
get tableConfig(): TableColumnConfig<Dossier>[] {
@ -38,19 +40,11 @@ export class ConfigService {
return this._userService.currentUser;
}
_myDossiersChecker = (dw: Dossier) => dw.ownerId === this._currentUser.id;
_toApproveChecker = (dw: Dossier) => dw.approverIds.includes(this._currentUser.id);
_toReviewChecker = (dw: Dossier) => dw.memberIds.includes(this._currentUser.id);
_otherChecker = (dw: Dossier) => !dw.memberIds.includes(this._currentUser.id);
buttonsConfig(addDossier: () => void): ButtonConfig[] {
get buttonsConfig(): ButtonConfig[] {
return [
{
label: _('dossier-listing.add-new'),
action: addDossier,
action: () => this._openAddDossierDialog(),
hide: !this._currentUser.isManager,
icon: 'iqser:plus',
type: 'primary',
@ -208,6 +202,18 @@ export class ConfigService {
return filterGroups;
}
private _myDossiersChecker = (dw: Dossier) => dw.ownerId === this._currentUser.id;
private _toApproveChecker = (dw: Dossier) => dw.approverIds.includes(this._currentUser.id);
private _toReviewChecker = (dw: Dossier) => dw.memberIds.includes(this._currentUser.id);
private _otherChecker = (dw: Dossier) => !dw.memberIds.includes(this._currentUser.id);
private _openAddDossierDialog(): void {
this._dialogService.openDialog('addDossier', null, null);
}
private _quickFilters(entities: Dossier[]): NestedFilter[] {
const myDossiersLabel = this._translateService.instant('dossier-listing.quick-filters.my-dossiers');
const filters = [

28
apps/red-ui/src/app/modules/dossiers-listing/screen/dossiers-listing-screen.component.ts
View File

@ -2,16 +2,13 @@ import { ChangeDetectionStrategy, Component, forwardRef, Injector, OnInit, Templ
import { Dossier } from '@red/domain';
import { UserService } from '@services/user.service';
import { PermissionsService } from '@services/permissions.service';
import { TranslateChartService } from '@services/translate-chart.service';
import { Router } from '@angular/router';
import { DossiersDialogService } from '../../dossier/services/dossiers-dialog.service';
import { DefaultListingServicesTmp, EntitiesService, ListingComponent, OnAttach, TableComponent } from '@iqser/common-ui';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { ConfigService } from '../config.service';
import { ActiveDossiersService } from '@services/dossiers/active-dossiers.service';
import { FilesService } from '@services/entity-services/files.service';
import { DossierTemplatesService } from '@services/entity-services/dossier-templates.service';
import { tap } from 'rxjs/operators';
import { DossiersDialogService } from '../../dossier/services/dossiers-dialog.service';
@Component({
templateUrl: './dossiers-listing-screen.component.html',
@ -27,7 +24,7 @@ export class DossiersListingScreenComponent extends ListingComponent<Dossier> im
readonly currentUser = this._userService.currentUser;
readonly tableColumnConfigs = this._configService.tableConfig;
readonly tableHeaderLabel = _('dossier-listing.table-header.title');
readonly buttonConfigs = this._configService.buttonsConfig(() => this.openAddDossierDialog());
readonly buttonConfigs = this._configService.buttonsConfig;
@ViewChild('needsWorkFilterTemplate', {
read: TemplateRef,
static: true,
@ -36,16 +33,13 @@ export class DossiersListingScreenComponent extends ListingComponent<Dossier> im
@ViewChild(TableComponent) private readonly _tableComponent: TableComponent<Dossier>;
constructor(
private readonly _router: Router,
protected readonly _injector: Injector,
private readonly _userService: UserService,
readonly permissionsService: PermissionsService,
private readonly _activeDossiersService: ActiveDossiersService,
private readonly _dialogService: DossiersDialogService,
private readonly _translateChartService: TranslateChartService,
private readonly _configService: ConfigService,
private readonly _filesService: FilesService,
private readonly _dossierTemplatesService: DossierTemplatesService,
private readonly _dialogService: DossiersDialogService,
) {
super(_injector);
}
@ -54,6 +48,10 @@ export class DossiersListingScreenComponent extends ListingComponent<Dossier> im
return this._dossierTemplatesService.all[0].id;
}
openAddDossierDialog(): void {
this._dialogService.openDialog('addDossier', null, null);
}
ngOnInit(): void {
this.addSubscription = this._activeDossiersService.all$.pipe(tap(() => this._computeAllFilters())).subscribe();
}
@ -62,18 +60,6 @@ export class DossiersListingScreenComponent extends ListingComponent<Dossier> im
this._tableComponent?.scrollToLastIndex();
}
openAddDossierDialog(): void {
this._dialogService.openDialog('addDossier', null, null, async (addResponse: { dossier: Dossier; addMembers: boolean }) => {
await this._router.navigate([addResponse.dossier.routerLink]);
if (addResponse.addMembers) {
this._dialogService.openDialog('editDossier', null, {
dossierId: addResponse.dossier.dossierId,
section: 'members',
});
}
});
}
private _computeAllFilters() {
const filterGroups = this._configService.filterGroups(this.entitiesService.all, this._needsWorkFilterTemplate);
this.filterService.addFilterGroups(filterGroups);

10
apps/red-ui/src/assets/i18n/de.json
View File

@ -585,6 +585,16 @@
}
},
"content": "Begründung",
"dashboard": {
"empty-template": {
"description": "",
"new-dossier": ""
},
"greeting": {
"subtitle": "",
"title": ""
}
},
"default-colors-screen": {
"action": {
"edit": "Farbe bearbeiten"

16
apps/red-ui/src/assets/i18n/en.json
View File

@ -8,12 +8,6 @@
"all": "All",
"none": "None"
},
"dashboard": {
"greeting": {
"title": "Welcome, {name}!",
"subtitle": "Here's what's happening in your redaction teams today."
}
},
"add-dossier-dialog": {
"actions": {
"save": "Save",
@ -591,6 +585,16 @@
}
},
"content": "Reason",
"dashboard": {
"empty-template": {
"description": "This template does not contain any dossiers. Start by creating a dossier to use it on.",
"new-dossier": "New Dossier"
},
"greeting": {
"subtitle": "Here's what's happening in your redaction teams today.",
"title": "Welcome, {name}!"
}
},
"default-colors-screen": {
"action": {
"edit": "Edit Color"

2
libs/common-ui

@ -1 +1 @@
Subproject commit 3684acc2c99fafc88351af188745c10065c16cdb
Subproject commit d815449b409ce3bd04f8f7fddbb74fe6ed5ef9b5