TSK-509 use predefined animations
Use animations from animation.ts file instead of creating a new definition for each component.
This commit is contained in:
parent
6a122c5afd
commit
b0325fdc41
|
@ -1,9 +1,8 @@
|
|||
import { Component, OnInit, Input, OnDestroy, SimpleChanges, OnChanges } from '@angular/core';
|
||||
import { Component, Input, OnDestroy, SimpleChanges, OnChanges } from '@angular/core';
|
||||
import { Subscription } from 'rxjs';
|
||||
|
||||
import { Workbasket } from 'app/models/workbasket';
|
||||
import { WorkbasketSummary } from 'app/models/workbasket-summary';
|
||||
import { WorkbasketAccessItems } from 'app/models/workbasket-access-items';
|
||||
import { WorkbasketSummaryResource } from 'app/models/workbasket-summary-resource';
|
||||
import { WorkbasketDistributionTargetsResource } from 'app/models/workbasket-distribution-targets-resource';
|
||||
import { ErrorModel } from 'app/models/modal-error';
|
||||
|
@ -146,7 +145,6 @@ export class DistributionTargetsComponent implements OnChanges, OnDestroy {
|
|||
}
|
||||
|
||||
performFilter(dualListFilter: any) {
|
||||
|
||||
dualListFilter.side === Side.RIGHT ? this.distributionTargetsRight = undefined : this.distributionTargetsLeft = undefined;
|
||||
this.onRequest(dualListFilter.side, false);
|
||||
this.workbasketFilterSubscription = this.workbasketService.getWorkBasketsSummary(true, undefined, undefined, undefined,
|
||||
|
|
|
@ -18,9 +18,7 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
<div [@toggle]="toolbarState" *ngIf="toolbarState" class="row no-overflow">
|
||||
<taskana-filter [allTypes]="filteringTypes" [filterParams]="filterParams"
|
||||
[filterType]="filterType"
|
||||
(performFilter)="filtering($event)"></taskana-filter>
|
||||
<div [@toggleDown]="toolbarState" *ngIf="toolbarState" class="row no-overflow">
|
||||
<taskana-filter (performFilter)="filtering($event)"></taskana-filter>
|
||||
</div>
|
||||
</li>
|
||||
|
|
|
@ -1,32 +1,18 @@
|
|||
import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
|
||||
import {animate, keyframes, style, transition, trigger} from '@angular/animations';
|
||||
import {ActivatedRoute, Router} from '@angular/router';
|
||||
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
|
||||
import {SortingModel} from 'app/models/sorting';
|
||||
import {FilterModel} from 'app/models/filter';
|
||||
import {Subscription} from 'rxjs';
|
||||
import {WorkbasketSummary} from 'app/models/workbasket-summary';
|
||||
import { SortingModel } from 'app/models/sorting';
|
||||
import { FilterModel } from 'app/models/filter';
|
||||
import { Subscription } from 'rxjs';
|
||||
import { WorkbasketSummary } from 'app/models/workbasket-summary';
|
||||
|
||||
import {ErrorModalService} from 'app/services/errorModal/error-modal.service';
|
||||
import {RequestInProgressService} from 'app/services/requestInProgress/request-in-progress.service';
|
||||
import {WorkbasketService} from 'app/services/workbasket/workbasket.service';
|
||||
import {AlertService} from 'app/services/alert/alert.service';
|
||||
import {TaskanaType} from 'app/models/taskana-type';
|
||||
import { WorkbasketService } from 'app/services/workbasket/workbasket.service';
|
||||
import { TaskanaType } from 'app/models/taskana-type';
|
||||
import { expandDown } from 'app/shared/animations/expand.animation';
|
||||
|
||||
@Component({
|
||||
selector: 'taskana-workbasket-list-toolbar',
|
||||
animations: [
|
||||
trigger('toggle', [
|
||||
transition('void => *', animate('300ms ease-in', keyframes([
|
||||
style({height: '0px'}),
|
||||
style({height: '50px'}),
|
||||
style({height: '*'})]))),
|
||||
transition('* => void', animate('300ms ease-out', keyframes([
|
||||
style({height: '*'}),
|
||||
style({height: '50px'}),
|
||||
style({height: '0px'})])))
|
||||
]
|
||||
)],
|
||||
animations: [expandDown],
|
||||
templateUrl: './workbasket-list-toolbar.component.html',
|
||||
styleUrls: ['./workbasket-list-toolbar.component.scss']
|
||||
})
|
||||
|
@ -49,10 +35,7 @@ export class WorkbasketListToolbarComponent implements OnInit {
|
|||
constructor(
|
||||
private workbasketService: WorkbasketService,
|
||||
private route: ActivatedRoute,
|
||||
private router: Router,
|
||||
private errorModalService: ErrorModalService,
|
||||
private requestInProgressService: RequestInProgressService,
|
||||
private alertService: AlertService) {
|
||||
private router: Router) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
@ -68,7 +51,7 @@ export class WorkbasketListToolbarComponent implements OnInit {
|
|||
|
||||
addWorkbasket() {
|
||||
this.workbasketService.selectWorkBasket(undefined);
|
||||
this.router.navigate([{outlets: {detail: ['new-workbasket']}}], {relativeTo: this.route});
|
||||
this.router.navigate([{ outlets: { detail: ['new-workbasket'] } }], { relativeTo: this.route });
|
||||
}
|
||||
|
||||
importEvent() {
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
<span>Roles</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="white pull-right roles col-xs-12" [@toggle]="showRoles" *ngIf="showRoles">
|
||||
<div class="white pull-right roles col-xs-12" [@toggleDown]="showRoles" *ngIf="showRoles">
|
||||
<span><i>{{roles}}</i></span>
|
||||
</div>
|
||||
</div>
|
|
@ -1,24 +1,13 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import { TaskanaEngineService } from 'app/services/taskana-engine/taskana-engine.service';
|
||||
import { UserInfoModel } from 'app/models/user-info';
|
||||
import { trigger, transition, animate, keyframes, style } from '@angular/animations';
|
||||
import { expandDown } from '../../shared/animations/expand.animation';
|
||||
|
||||
@Component({
|
||||
selector: 'taskana-user-information',
|
||||
templateUrl: './user-information.component.html',
|
||||
styleUrls: ['./user-information.component.scss'],
|
||||
animations: [
|
||||
trigger('toggle', [
|
||||
transition('void => *', animate('300ms ease-in', keyframes([
|
||||
style({ opacity: 0, height: '0px' }),
|
||||
style({ opacity: 1, height: '10px' }),
|
||||
style({ opacity: 1, height: '*' })]))),
|
||||
transition('* => void', animate('300ms ease-out', keyframes([
|
||||
style({ opacity: 1, height: '*' }),
|
||||
style({ opacity: 0, height: '10px' }),
|
||||
style({ opacity: 0, height: '0px' })])))
|
||||
]
|
||||
)],
|
||||
animations: [expandDown],
|
||||
})
|
||||
export class UserInformationComponent implements OnInit {
|
||||
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import {AfterContentInit, Component, EventEmitter, Input, Output, OnInit} from '@angular/core';
|
||||
import {ICONTYPES} from 'app/models/type';
|
||||
import {FilterModel} from 'app/models/filter';
|
||||
import {TaskanaType} from 'app/models/taskana-type';
|
||||
import { Component, EventEmitter, Input, Output, OnInit } from '@angular/core';
|
||||
import { ICONTYPES } from 'app/models/type';
|
||||
import { FilterModel } from 'app/models/filter';
|
||||
import { TaskanaType } from 'app/models/taskana-type';
|
||||
|
||||
@Component({
|
||||
selector: 'taskana-filter',
|
||||
|
@ -10,11 +10,12 @@ import {TaskanaType} from 'app/models/taskana-type';
|
|||
})
|
||||
export class FilterComponent implements OnInit {
|
||||
|
||||
@Input() allTypes: Map<string, string>;
|
||||
@Input() allTypes: Map<string, string> = new Map([['ALL', 'All'], ['PERSONAL', 'Personal'], ['GROUP', 'Group'],
|
||||
['CLEARANCE', 'Clearance'], ['TOPIC', 'Topic']]);
|
||||
|
||||
@Input() filterParams: any;
|
||||
@Input() filterParams = { name: '', key: '', type: '', description: '', owner: '' };
|
||||
|
||||
@Input() filterType: TaskanaType;
|
||||
@Input() filterType = TaskanaType.WORKBASKETS;
|
||||
|
||||
@Output() performFilter = new EventEmitter<FilterModel>();
|
||||
|
||||
|
|
|
@ -8,6 +8,9 @@ import { RouterModule } from '@angular/router';
|
|||
import { TreeModule } from 'angular-tree-component';
|
||||
import { TypeaheadModule } from 'ngx-bootstrap';
|
||||
|
||||
/**
|
||||
* Components
|
||||
*/
|
||||
import { GeneralMessageModalComponent } from 'app/shared/general-message-modal/general-message-modal.component';
|
||||
import { SpinnerComponent } from 'app/shared/spinner/spinner.component';
|
||||
import { AlertComponent } from 'app/shared/alert/alert.component';
|
||||
|
@ -44,7 +47,7 @@ const MODULES = [
|
|||
AngularSvgIconModule,
|
||||
HttpClientModule,
|
||||
RouterModule,
|
||||
TreeModule,
|
||||
TreeModule
|
||||
];
|
||||
|
||||
const DECLARATIONS = [
|
||||
|
|
|
@ -25,7 +25,7 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
<div [@toggle]="toolbarState" *ngIf="toolbarState" class="row no-overflow">
|
||||
<div [@toggleDown]="toolbarState" *ngIf="toolbarState" class="row no-overflow">
|
||||
<taskana-filter
|
||||
[filterParams]="filterParams"
|
||||
[filterType]="filterType"
|
||||
|
|
|
@ -1,27 +1,16 @@
|
|||
import {Component, EventEmitter, OnInit, Output} from '@angular/core';
|
||||
import {animate, keyframes, style, transition, trigger} from '@angular/animations';
|
||||
import {Task} from 'app/workplace/models/task';
|
||||
import {Workbasket} from 'app/models/workbasket';
|
||||
import {TaskService} from 'app/workplace/services/task.service';
|
||||
import {WorkbasketService} from 'app/services/workbasket/workbasket.service';
|
||||
import {SortingModel} from 'app/models/sorting';
|
||||
import {FilterModel} from 'app/models/filter';
|
||||
import {TaskanaType} from 'app/models/taskana-type';
|
||||
import { Component, EventEmitter, OnInit, Output } from '@angular/core';
|
||||
import { Task } from 'app/workplace/models/task';
|
||||
import { Workbasket } from 'app/models/workbasket';
|
||||
import { TaskService } from 'app/workplace/services/task.service';
|
||||
import { WorkbasketService } from 'app/services/workbasket/workbasket.service';
|
||||
import { SortingModel } from 'app/models/sorting';
|
||||
import { FilterModel } from 'app/models/filter';
|
||||
import { TaskanaType } from 'app/models/taskana-type';
|
||||
import { expandDown } from 'app/shared/animations/expand.animation';
|
||||
|
||||
@Component({
|
||||
selector: 'taskana-tasklist-toolbar',
|
||||
animations: [
|
||||
trigger('toggle', [
|
||||
transition('void => *', animate('300ms ease-in', keyframes([
|
||||
style({height: '0px'}),
|
||||
style({height: '50px'}),
|
||||
style({height: '*'})]))),
|
||||
transition('* => void', animate('300ms ease-out', keyframes([
|
||||
style({height: '*'}),
|
||||
style({height: '50px'}),
|
||||
style({height: '0px'})])))
|
||||
]
|
||||
)],
|
||||
animations: [expandDown],
|
||||
templateUrl: './tasklist-toolbar.component.html',
|
||||
styleUrls: ['./tasklist-toolbar.component.scss']
|
||||
})
|
||||
|
@ -33,7 +22,7 @@ export class TaskListToolbarComponent implements OnInit {
|
|||
@Output() performFilter = new EventEmitter<FilterModel>();
|
||||
|
||||
sortingFields = new Map([['name', 'Name'], ['priority', 'Priority'], ['due', 'Due'], ['planned', 'Planned']]);
|
||||
filterParams = {name: '', key: '', owner: '', priority: '', state: ''};
|
||||
filterParams = { name: '', key: '', owner: '', priority: '', state: '' };
|
||||
tasks: Task[] = [];
|
||||
|
||||
workbasketNames: string[] = [];
|
||||
|
@ -46,7 +35,7 @@ export class TaskListToolbarComponent implements OnInit {
|
|||
filterType = TaskanaType.TASKS;
|
||||
|
||||
constructor(private taskService: TaskService,
|
||||
private workbasketService: WorkbasketService) {
|
||||
private workbasketService: WorkbasketService) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
@ -83,14 +72,14 @@ export class TaskListToolbarComponent implements OnInit {
|
|||
getTasks(workbasketId: string) {
|
||||
this.taskService.findTasksWithWorkbasket(workbasketId, undefined, undefined,
|
||||
undefined, undefined, undefined, undefined).subscribe(
|
||||
tasks => {
|
||||
this.tasks.length = 0;
|
||||
if (!tasks || tasks._embedded === undefined) {
|
||||
return;
|
||||
}
|
||||
this.tasks = tasks._embedded.tasks;
|
||||
this.tasksChanged.emit(this.tasks);
|
||||
});
|
||||
tasks => {
|
||||
this.tasks.length = 0;
|
||||
if (!tasks || tasks._embedded === undefined) {
|
||||
return;
|
||||
}
|
||||
this.tasks = tasks._embedded.tasks;
|
||||
this.tasksChanged.emit(this.tasks);
|
||||
});
|
||||
}
|
||||
|
||||
sorting(sort: SortingModel) {
|
||||
|
|
Loading…
Reference in New Issue