mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ADF-3775] APS 2 Process and Task view in the ADF Demo Application (#4035)
* [ADF-3775] Created breadcrumb component for layout demo * [ADF-3775] Created filter demo component * [ADF-3775] Created apps demo component * [ADF-3775] Created tasks list cloud demo component * [ADF-3775] Created tasks process cloud demo component * [ADF-3775] Created new cloud layout component * [ADF-3775] Improved translation * [ADF-3775] Fixed translation * [ADF-3775] Improved layout * Use the EditTaskFilters TaskFilterCloud should have a stream of filter Fix integration issues * Remove useless route Enable start task cloud button * Remove useless pages and handle start task error event * Fix wrong unit test * Use the Process Cloud menu name
This commit is contained in:
Deepak Paul
committed by
Eugenio Romano
Eugenio Romano
parent
4302cfbd04
commit
ced1901c89
@@ -1,2 +0,0 @@
|
||||
|
||||
<adf-cloud-app-list (appClick)="onAppClick($event)"></adf-cloud-app-list>
|
||||
@@ -1,33 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright 2016 Alfresco Software, Ltd.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component } from '@angular/core';
|
||||
import { Router } from '@angular/router';
|
||||
@Component({
|
||||
selector: 'app-cloud',
|
||||
templateUrl: './cloud.component.html',
|
||||
styleUrls: ['./cloud.component.scss']
|
||||
})
|
||||
export class CloudComponent {
|
||||
|
||||
constructor(private router: Router) {
|
||||
}
|
||||
|
||||
onAppClick(app) {
|
||||
this.router.navigate([`/cloud/${app.name}/tasks/`]);
|
||||
}
|
||||
}
|
||||
@@ -1,73 +0,0 @@
|
||||
<h3>{{'PROCESS_LIST_CLOUD.TITLE' | translate}}</h3>
|
||||
<adf-cloud-process-filters
|
||||
[appName]="currentAppName"
|
||||
[showIcons]="true"
|
||||
(filterClick)="onFilterSelected($event)"
|
||||
*ngIf="currentAppName">
|
||||
</adf-cloud-process-filters>
|
||||
|
||||
<adf-cloud-app-list *ngIf="!currentAppName"
|
||||
(appClick)="onAppClick($event)"></adf-cloud-app-list>
|
||||
<div *ngIf="currentAppName">
|
||||
<mat-accordion>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
{{filterName | translate}}
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
Customise your filter
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
<div>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Status" [(ngModel)]="status">
|
||||
<mat-option value="">
|
||||
ALL
|
||||
</mat-option>
|
||||
<mat-option value="RUNNING">
|
||||
RUNNING
|
||||
</mat-option>
|
||||
<mat-option value="COMPLETED">
|
||||
COMPLETED
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select [formControl]="sortFormControl">
|
||||
<mat-option [value]="''">Select a column</mat-option>
|
||||
<mat-option *ngFor="let column of columns" [value]="column.key">
|
||||
{{column.label}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select [formControl]="sortDirectionFormControl">
|
||||
<mat-option [value]="''">Select a direction</mat-option>
|
||||
<mat-option value="ASC">
|
||||
ASC
|
||||
</mat-option>
|
||||
<mat-option value="DESC">
|
||||
DESC
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
</mat-accordion>
|
||||
<adf-cloud-process-list
|
||||
[applicationName]="currentAppName"
|
||||
[status]="status"
|
||||
[sorting]="sortArray"
|
||||
[id]="filterId"
|
||||
#processCloud>
|
||||
<data-columns>
|
||||
<data-column key="entry.id" title="Id"></data-column>
|
||||
<data-column key="entry.appName" title="Name"></data-column>
|
||||
<data-column key="entry.status" title="Status"></data-column>
|
||||
</data-columns>
|
||||
</adf-cloud-process-list>
|
||||
<adf-pagination [target]="processCloud" (changePageSize)="onChangePageSize($event)">
|
||||
</adf-pagination>
|
||||
<button mat-fab class="adf-process-list-cloud-button" color="primary" (click)="onClick()">Back</button>
|
||||
</div>
|
||||
@@ -1,11 +0,0 @@
|
||||
.adf-process-list-cloud-button {
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
.adf-process-cloud-spacing {
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
mat-form-field {
|
||||
margin-left: 10px;
|
||||
}
|
||||
@@ -1,106 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright 2016 Alfresco Software, Ltd.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, ViewChild, OnInit } from '@angular/core';
|
||||
import { UserPreferencesService } from '@alfresco/adf-core';
|
||||
import { ProcessListCloudComponent } from '@alfresco/adf-process-services-cloud';
|
||||
import { FormControl } from '@angular/forms';
|
||||
|
||||
@Component({
|
||||
selector: 'app-process-list-example',
|
||||
templateUrl: './process-list-cloud-example.component.html',
|
||||
styleUrls: ['./process-list-cloud-example.component.scss']
|
||||
})
|
||||
export class ProcessListCloudExampleComponent implements OnInit {
|
||||
|
||||
@ViewChild('processCloud')
|
||||
processCloud: ProcessListCloudComponent;
|
||||
|
||||
sortFormControl: FormControl;
|
||||
sortDirectionFormControl: FormControl;
|
||||
|
||||
currentAppName: string = '';
|
||||
filterName: string = '';
|
||||
status: string = '';
|
||||
filterId: string = '';
|
||||
sort: string = '';
|
||||
sortArray: any[];
|
||||
sortField: string;
|
||||
sortDirection: string;
|
||||
|
||||
columns = [
|
||||
{key: 'id', label: 'ID'},
|
||||
{key: 'name', label: 'NAME'},
|
||||
{key: 'status', label: 'STATUS'},
|
||||
{key: 'startDate', label: 'START DATE'}
|
||||
];
|
||||
|
||||
constructor(private userPreference: UserPreferencesService) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.sortFormControl = new FormControl('');
|
||||
|
||||
this.sortFormControl.valueChanges.subscribe(
|
||||
(sortValue) => {
|
||||
this.sort = sortValue;
|
||||
|
||||
this.sortArray = [{
|
||||
orderBy: this.sort,
|
||||
direction: this.sortDirection
|
||||
}];
|
||||
}
|
||||
);
|
||||
this.sortDirectionFormControl = new FormControl('');
|
||||
|
||||
this.sortDirectionFormControl.valueChanges.subscribe(
|
||||
(sortDirectionValue) => {
|
||||
this.sortDirection = sortDirectionValue;
|
||||
|
||||
this.sortArray = [{
|
||||
orderBy: this.sort,
|
||||
direction: this.sortDirection
|
||||
}];
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
onAppClick(appClicked: any) {
|
||||
this.currentAppName = appClicked.name;
|
||||
}
|
||||
|
||||
onClick() {
|
||||
this.currentAppName = '';
|
||||
}
|
||||
|
||||
onChangePageSize(event) {
|
||||
this.userPreference.paginationSize = event.maxItems;
|
||||
}
|
||||
|
||||
onClearFilters() {
|
||||
this.processCloud.reload();
|
||||
}
|
||||
|
||||
onFilterSelected(filter) {
|
||||
this.status = filter.query.state || '';
|
||||
this.sort = filter.query.sort;
|
||||
this.sortDirection = filter.query.order;
|
||||
this.filterName = filter.name;
|
||||
this.sortDirectionFormControl.setValue(this.sortDirection);
|
||||
this.sortFormControl.setValue(this.sort);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user