Skip to content

Commit f7ee2cc

Browse files
EventGroup-Link-Event (#280)
* EventGroup-Link-Event * Fix Link logic * Chromedriver update * Fixes Co-authored-by: Sandor Ban <[email protected]>
1 parent 15cbab5 commit f7ee2cc

17 files changed

+439
-2
lines changed

src/app/_constants/form-identifiers.ts

+1
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ export const EVENT_FILTERS_FORM_ID = 'eventFilters';
2929
export const EVENT_GROUP_FILTERS_FORM_ID = 'eventGroupFilters';
3030
export const EVENT_GROUPS_FORM_ID = 'eventGroups';
3131
export const ADD_EVENT_GROUP_FORM_ID = 'addEventGroup';
32+
export const EVENT_GROUP_LINK_EVENT_FILTERS_FORM_ID = 'eventGroupLinkEventFilters';
3233
export const EVENT_GROUP_FILTERS_ADD_EVENTS_MODAL_FORM_ID = 'eventGroupAddEventModalFilters';
3334

3435
export const PERSON_DETAILS_FORM_ID = 'person';
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
import { FORM_DATA_SEARCHBOX } from '../../app.constants';
2+
import { DateFilterOptions } from '../../_constants/enums';
3+
import { FORM_DATA_DATE, FORM_DATA_SELECT } from '../../_constants/form-data';
4+
import { FormGroupStyleType } from '../../_models/common';
5+
import { EnumToKeyValuePipe } from '../../_pipes/enum-to-key-value/enum-to-key-value.pipe';
6+
7+
const pipe = new EnumToKeyValuePipe();
8+
9+
const dateFilterOptions = pipe.transform(DateFilterOptions);
10+
11+
export const FORM_DATA_EVENT_GROUP_LINK_EVENT_FILTERS = [
12+
{
13+
id: 'search',
14+
title: '',
15+
appearance: FormGroupStyleType.BASIC,
16+
fields: [
17+
{
18+
...FORM_DATA_SEARCHBOX,
19+
key: 'freeText',
20+
placeholder: 'strings.promptSearch',
21+
className: 'fullwidth search-box',
22+
},
23+
{
24+
...FORM_DATA_SELECT,
25+
key: 'dateFilterOption',
26+
options: dateFilterOptions,
27+
value: 'DATE',
28+
className: 'fullwidth',
29+
},
30+
{
31+
...FORM_DATA_DATE,
32+
key: 'eventDateFrom',
33+
hint: 'eventGroup.linkEvent.filters.from',
34+
className: 'fullwidth',
35+
},
36+
{
37+
...FORM_DATA_DATE,
38+
key: 'eventDateTo',
39+
hint: 'strings.promptEventDateTo',
40+
className: 'fullwidth',
41+
},
42+
],
43+
},
44+
];
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import { HttpClientTestingModule } from '@angular/common/http/testing';
2+
import { ComponentFixture, TestBed } from '@angular/core/testing';
3+
import { TranslateModule } from '@ngx-translate/core';
4+
5+
import { EventGroupLinkEventsModalFiltersComponent } from './event-group-link-events-modal-filters.component';
6+
7+
describe('EventGroupLinkEventsModalFiltersComponent', () => {
8+
let component: EventGroupLinkEventsModalFiltersComponent;
9+
let fixture: ComponentFixture<EventGroupLinkEventsModalFiltersComponent>;
10+
11+
beforeEach(async () => {
12+
await TestBed.configureTestingModule({
13+
declarations: [EventGroupLinkEventsModalFiltersComponent],
14+
imports: [HttpClientTestingModule, TranslateModule.forRoot()],
15+
}).compileComponents();
16+
});
17+
18+
beforeEach(() => {
19+
fixture = TestBed.createComponent(EventGroupLinkEventsModalFiltersComponent);
20+
component = fixture.componentInstance;
21+
fixture.detectChanges();
22+
});
23+
24+
it('should create', () => {
25+
expect(component).toBeTruthy();
26+
});
27+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { Component } from '@angular/core';
2+
import { FiltersFormComponent } from '../../shared/filters/filters-form/filters-form.component';
3+
4+
@Component({
5+
selector: 'app-event-group-link-events-modal-filters',
6+
templateUrl: '../../shared/filters/filters-form/filters-form.component.html',
7+
})
8+
export class EventGroupLinkEventsModalFiltersComponent extends FiltersFormComponent {}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
import { TableColumn, TableDataFormatOptions } from '../../_models/common';
2+
3+
export const defaultColumnDefs: TableColumn[] = [
4+
{
5+
name: 'captions.Event.eventTitle',
6+
dataKey: 'eventTitle',
7+
isSortable: true,
8+
essential: true,
9+
className: 'bold',
10+
},
11+
{
12+
name: 'eventGroup.linkEvent.status',
13+
dataKey: 'eventStatus',
14+
isSortable: true,
15+
},
16+
{
17+
name: 'captions.date',
18+
dataKey: 'startDate',
19+
format: {
20+
type: 'DATE',
21+
pattern: 'd/M/yyyy',
22+
},
23+
isSortable: true,
24+
},
25+
{
26+
name: 'eventGroup.linkEvent.reportDate',
27+
format: {
28+
type: 'DATE',
29+
pattern: 'd/M/yyyy',
30+
},
31+
dataKey: 'reportDateTime',
32+
isSortable: true,
33+
},
34+
{
35+
name: 'captions.Location',
36+
format: {
37+
type: TableDataFormatOptions.DISPLAY,
38+
pattern: '$param1, $param2, $param3, $param4',
39+
params: [
40+
'eventLocation.city',
41+
'eventLocation.street',
42+
'eventLocation.region',
43+
'eventLocation.district',
44+
],
45+
},
46+
dataKey: 'eventLocation',
47+
isSortable: true,
48+
},
49+
];
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
<div mat-dialog-title>
2+
<h2>{{ 'captions.linkEvent' | translate }}</h2>
3+
<div mat-dialog-actions>
4+
<button mat-icon-button mat-dialog-close class="button-dialog-close">
5+
<mat-icon class="material-icons-round">highlight_off</mat-icon>
6+
</button>
7+
<button mat-stroked-button color="primary" class="cancel-btn" mat-dialog-close>
8+
{{ 'captions.actionCancel' | translate }}
9+
</button>
10+
<button
11+
[disabled]="!selectedEvent?.uuid"
12+
mat-flat-button
13+
color="primary"
14+
class="confirm-btn"
15+
(click)="confirm()"
16+
>
17+
{{ 'captions.actionConfirm' | translate }}
18+
</button>
19+
</div>
20+
</div>
21+
22+
<div mat-dialog-content>
23+
<div class="top">
24+
<div class="text">
25+
<mat-icon class="material-icons-round">info</mat-icon>
26+
<p>{{ 'strings.infoPickOrCreateSuperordinateEventForEvent' | translate }}</p>
27+
</div>
28+
</div>
29+
30+
<div class="event-group-link-event-container">
31+
<div class="filters-container">
32+
<app-event-group-link-events-modal-filters
33+
class="filters"
34+
[formId]="formId"
35+
[data]="filtersData"
36+
[showFilterHeader]="false"
37+
filters
38+
>
39+
</app-event-group-link-events-modal-filters>
40+
<button
41+
mat-button
42+
class="button-reset"
43+
color="primary"
44+
(click)="resetFilters()"
45+
(keyup.enter)="resetFilters()"
46+
>
47+
{{ 'captions.actionResetFilters' | translate }}
48+
</button>
49+
</div>
50+
<app-table
51+
class="event-group-link-event-table"
52+
[resourceService]="eventService"
53+
[tableColumns]="defaultColumns"
54+
[isSortable]="true"
55+
[isSelectable]="true"
56+
[isSelectableOnce]="true"
57+
[isSelectableCheckboxHidden]="true"
58+
[isHeaderSticky]="true"
59+
[allowToggleColumns]="false"
60+
[fullHeight]="true"
61+
[appearance]="tableAppearanceOptions.MINIMAL"
62+
(selectItem)="onSelectEvent($event)"
63+
[preSetFilters]="presetFilters"
64+
></app-table>
65+
</div>
66+
</div>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
@use '/src/variables.scss' as *;
2+
3+
.mat-dialog-title {
4+
padding-top: 40px;
5+
6+
> h2 {
7+
margin: 0;
8+
font-size: 34px;
9+
}
10+
}
11+
12+
.mat-dialog-content {
13+
padding: 25px;
14+
background: $white;
15+
16+
#searchEventGroup {
17+
width: 212px;
18+
margin: 10px 0;
19+
margin-left: 40px;
20+
}
21+
22+
.search-field {
23+
.search-icon {
24+
width: 14px;
25+
height: 12px;
26+
color: map-get($sormas-accent, 200);
27+
font-size: 12px;
28+
}
29+
::placeholder {
30+
color: map-get($sormas-accent, 200);
31+
font-size: 12px;
32+
}
33+
}
34+
35+
.top {
36+
overflow: hidden;
37+
38+
.text {
39+
overflow: hidden;
40+
max-width: 600px;
41+
margin-left: 40px;
42+
float: left;
43+
.mat-icon {
44+
display: inline-block;
45+
color: mat-color($sormas-accent, 500);
46+
font-size: 18px;
47+
}
48+
49+
> p {
50+
display: inline-block;
51+
width: 95%;
52+
color: mat-color($sormas-accent, 500);
53+
font-size: 12px;
54+
vertical-align: top;
55+
}
56+
}
57+
.new-event-group-btn {
58+
float: right;
59+
}
60+
}
61+
}
62+
63+
.event-group-link-event-container {
64+
display: flex;
65+
flex-direction: row;
66+
.filters-container {
67+
max-width: 228px;
68+
height: fit-content;
69+
text-align: center;
70+
border: solid 1px mat-color($sormas-accent, 200);
71+
padding: 24px 24px 0;
72+
margin: 0 15px 0 0;
73+
border-radius: 4px;
74+
}
75+
.event-group-link-event-table {
76+
width: 100%;
77+
}
78+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { HttpClientTestingModule } from '@angular/common/http/testing';
2+
import { ComponentFixture, TestBed } from '@angular/core/testing';
3+
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
4+
import { TranslateModule } from '@ngx-translate/core';
5+
6+
import { EventGroupLinkEventsModalComponent } from './event-group-link-events-modal.component';
7+
8+
describe('EventGroupLinkEventsModalComponent', () => {
9+
let component: EventGroupLinkEventsModalComponent;
10+
let fixture: ComponentFixture<EventGroupLinkEventsModalComponent>;
11+
12+
beforeEach(async () => {
13+
await TestBed.configureTestingModule({
14+
declarations: [EventGroupLinkEventsModalComponent],
15+
imports: [HttpClientTestingModule, MatDialogModule, TranslateModule.forRoot()],
16+
providers: [
17+
{ provide: MAT_DIALOG_DATA, useValue: {} },
18+
{ provide: MatDialogRef, useValue: {} },
19+
],
20+
}).compileComponents();
21+
});
22+
23+
beforeEach(() => {
24+
fixture = TestBed.createComponent(EventGroupLinkEventsModalComponent);
25+
component = fixture.componentInstance;
26+
fixture.detectChanges();
27+
});
28+
29+
it('should create', () => {
30+
expect(component).toBeTruthy();
31+
});
32+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
import { Component, Inject, OnInit } from '@angular/core';
2+
import { FormGroup } from '@angular/forms';
3+
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
4+
import { FormBase } from '../../shared/dynamic-form/types/form-element-base';
5+
import { TableAppearanceOptions } from '../../_constants/enums';
6+
import { EVENT_GROUP_LINK_EVENT_FILTERS_FORM_ID } from '../../_constants/form-identifiers';
7+
import { Filter, TableColumn } from '../../_models/common';
8+
import { EventDto } from '../../_models/eventDto';
9+
import { EventService } from '../../_services/api/event.service';
10+
import { FilterService } from '../../_services/filter.service';
11+
import { FORM_DATA_EVENT_GROUP_LINK_EVENT_FILTERS } from '../event-group-link-events-modal-filters/event-group-link-events-modal-filters-form-data';
12+
import { defaultColumnDefs } from './event-group-link-events-modal-table-data';
13+
14+
@Component({
15+
selector: 'app-event-group-link-events-modal',
16+
templateUrl: './event-group-link-events-modal.component.html',
17+
styleUrls: ['./event-group-link-events-modal.component.scss'],
18+
})
19+
export class EventGroupLinkEventsModalComponent implements OnInit {
20+
defaultColumns: TableColumn[] = [];
21+
filtersForm = new FormGroup({});
22+
selectedEvent: EventDto | null;
23+
presetFilters: Filter[];
24+
tableAppearanceOptions = TableAppearanceOptions;
25+
filtersData: FormBase<any>[] = JSON.parse(
26+
JSON.stringify(FORM_DATA_EVENT_GROUP_LINK_EVENT_FILTERS)
27+
);
28+
formId = EVENT_GROUP_LINK_EVENT_FILTERS_FORM_ID;
29+
30+
constructor(
31+
public dialogRef: MatDialogRef<EventGroupLinkEventsModalComponent>,
32+
@Inject(MAT_DIALOG_DATA) public data: any,
33+
public eventService: EventService,
34+
public filterService: FilterService
35+
) {}
36+
37+
ngOnInit(): void {
38+
this.defaultColumns = defaultColumnDefs;
39+
this.presetFilters = [
40+
{
41+
field: 'excludedUuids',
42+
value: this.data.excludeIds,
43+
},
44+
];
45+
}
46+
47+
onSelectEvent(event: any): void {
48+
this.selectedEvent = null;
49+
if (event.selected.length) {
50+
// eslint-disable-next-line prefer-destructuring
51+
this.selectedEvent = event.selected[0];
52+
}
53+
}
54+
55+
resetFilters(): void {
56+
this.filterService.setFilters([]);
57+
}
58+
59+
confirm(): void {
60+
this.dialogRef.close({
61+
selectedEvent: this.selectedEvent,
62+
});
63+
}
64+
}

src/app/events/event-group-profile/event-group-profile.component.html

+3-1
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,9 @@ <h2 class="events-title">
2323
</h2>
2424
<mat-card class="events-list">
2525
<p class="events-actions">
26-
<button mat-stroked-button color="primary">{{ 'captions.linkEvent' | translate }}</button>
26+
<button (click)="onLinkEvent()" mat-stroked-button color="primary">
27+
{{ 'captions.linkEvent' | translate }}
28+
</button>
2729
</p>
2830
<app-loader [show]="loading"></app-loader>
2931
<app-card-list

0 commit comments

Comments
 (0)