inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-12 17:04:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-3422] Process Services - Create settings tab (#3702)

Browse Source 
* settings tab added

* fix icon

* fix e2e
This commit is contained in:
bbcodrin 2018-09-18 18:09:09 +03:00 committed by Eugenio Romano
parent 26811f97b3
commit a801f656a7
9 changed files with 102 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
demo-shell/resources/i18n/en.json
View File

@ -174,6 +174,7 @@
"TASKS-TAB": "Tasks",
"PROCESSES-TAB": "Process",
"REPORTS-TAB": "Reports",
"SETTINGS-TAB": "Settings",
"START-TASK": "Start task",
"START-PROCESS": "Start process",
"PROCESS-AUDIT-LOG": "Process Audit log",

95
demo-shell/src/app/components/process-service/process-service.component.html
View File

@ -1,17 +1,19 @@
<mat-tab-group [(selectedIndex)]="activeTab" (selectedTabChange)="onTabChange($event)" data-automation-id="navigation-bar">
<mat-tab-group [(selectedIndex)]="activeTab" (selectedTabChange)="onTabChange($event)"
data-automation-id="navigation-bar">
<mat-tab id="tasks-header" href="#tasks" label="{{'PS-TAB.TASKS-TAB' | translate}}">
<div class="page-content" *ngIf="showTaskTab">
<div class="adf-grid" fxLayout="row" fxLayout.lt-lg="column" fxLayoutAlign="stretch">
<div class="adf-grid-item adf-tasks-menu" fxFlex.gt-md="225px">
<div class="adf-list-buttons">
<adf-sidebar-action-menu [expanded]="true" [width]="205" title="{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.CREATE' | translate}}">
<mat-icon sidebar-menu-title-icon >arrow_drop_down</mat-icon>
<div sidebar-menu-options>
<button mat-menu-item data-automation-id="btn-start-task" (click)="navigateStartTask()">
<mat-icon>assessment</mat-icon>
<span>{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.NEW_TASK' | translate}}</span>
</button>
</div>
<adf-sidebar-action-menu [expanded]="true" [width]="205"
title="{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.CREATE' | translate}}">
<mat-icon sidebar-menu-title-icon>arrow_drop_down</mat-icon>
<div sidebar-menu-options>
<button mat-menu-item data-automation-id="btn-start-task" (click)="navigateStartTask()">
<mat-icon>assessment</mat-icon>
<span>{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.NEW_TASK' | translate}}</span>
</button>
</div>
</adf-sidebar-action-menu>
</div>
<adf-accordion>
@ -20,7 +22,7 @@
<adf-task-filters
[filterParam]="filterSelected"
[appId]="appId"
[hasIcon]="false"
[hasIcon]="showTaskFilterIcon"
(filterClick)="onTaskFilterClick($event)"
(success)="onSuccessTaskFilterList($event)"
#activitifilter>
@ -28,16 +30,9 @@
</adf-accordion-group>
</adf-accordion>
</div>
<div class="adf-grid-item adf-tasks-list" fxFlex.gt-md="380px" [ngClass.gt-md]="{'small-pagination': true}"
<div class="adf-grid-item adf-tasks-list" fxFlex.gt-md="380px"
[ngClass.gt-md]="{'small-pagination': true}"
*ngIf="taskFilter && !isStartTaskMode()">
<mat-slide-toggle
class="adf-task-details-toggle"
id="showHeaderToggle"
[color]="'primary'"
(change)="toggleHeaderContent()"
[checked]="showHeaderContent">
{{ 'PS-TAB.TASK-SHOW-HEADER'| translate }}
</mat-slide-toggle>
<adf-tasklist
[appId]="taskFilter?.appId"
[presetColumn]="presetColumn"
@ -70,17 +65,18 @@
#taskListPagination>
</adf-pagination>
</div>
<div class="adf-grid-item adf-tasks-details" *ngIf="!isStartTaskMode()" fxFlex.gt-md="1 1 auto" data-automation-id="adf-tasks-details">
<div class="adf-grid-item adf-tasks-details" *ngIf="!isStartTaskMode()" fxFlex.gt-md="1 1 auto"
data-automation-id="adf-tasks-details">
<adf-task-details #activitidetails
[debugMode]="true"
[taskId]="currentTaskId"
[fieldValidators]="fieldValidators"
[showHeaderContent]="showHeaderContent"
(formCompleted)="onFormCompleted($event)"
(formContentClicked)="onContentClick($event)"
(taskCreated)="onTaskCreated($event)"
(assignTask)="onAssignTask()"
(taskDeleted)="onTaskDeleted($event)">
[debugMode]="true"
[taskId]="currentTaskId"
[fieldValidators]="fieldValidators"
[showHeaderContent]="showHeaderContent"
(formCompleted)="onFormCompleted($event)"
(formContentClicked)="onContentClick($event)"
(taskCreated)="onTaskCreated($event)"
(assignTask)="onAssignTask()"
(taskDeleted)="onTaskDeleted($event)">
</adf-task-details>
<mat-divider></mat-divider>
<div *ngIf="currentTaskId">
@ -96,7 +92,7 @@
</div>
<mat-card>
<mat-card-content>
<app-task-attachments [taskId]="currentTaskId" ></app-task-attachments>
<app-task-attachments [taskId]="currentTaskId"></app-task-attachments>
</mat-card-content>
</mat-card>
</div>
@ -111,15 +107,17 @@
</div>
</mat-tab>
<mat-tab id="processes-header" href="#processes"
label="{{'PS-TAB.PROCESSES-TAB' | translate}}">
label="{{'PS-TAB.PROCESSES-TAB' | translate}}">
<div class="page-content" *ngIf="showProcessTab">
<div class="adf-grid" fxLayout="row" fxLayout.lt-lg="column" fxLayoutAlign="stretch">
<div class="adf-grid-item adf-processes-menu" fxFlex.gt-md="225px">
<div class="adf-list-buttons">
<adf-sidebar-action-menu [expanded]="true" [width]="205" title="{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.CREATE' | translate}}">
<mat-icon sidebar-menu-title-icon >arrow_drop_down</mat-icon>
<adf-sidebar-action-menu [expanded]="true" [width]="205"
title="{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.CREATE' | translate}}">
<mat-icon sidebar-menu-title-icon>arrow_drop_down</mat-icon>
<div sidebar-menu-options>
<button mat-menu-item data-automation-id="btn-start-process" (click)="navigateStartProcess()">
<button mat-menu-item data-automation-id="btn-start-process"
(click)="navigateStartProcess()">
<mat-icon>assessment</mat-icon>
<span>{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.NEW_PROCESS' | translate}}</span>
</button>
@ -133,7 +131,7 @@
#activitiprocessfilter
[appId]="appId"
[filterParam]="filterSelected"
[showIcon]="false"
[showIcon]="showProcessFilterIcon"
(filterClick)="onProcessFilterChange($event)"
(filterSelected)="onProcessFilterChange($event)"
(success)="onSuccessProcessFilterList($event)">
@ -141,7 +139,8 @@
</adf-accordion-group>
</adf-accordion>
</div>
<div class="adf-grid-item adf-processes-list adf-list" fxFlex.gt-md="380px" [ngClass.gt-md]="{'small-pagination': true}"
<div class="adf-grid-item adf-processes-list adf-list" fxFlex.gt-md="380px"
[ngClass.gt-md]="{'small-pagination': true}"
*ngIf="processFilter && !isStartProcessMode()">
<adf-process-instance-list
#processList
@ -193,7 +192,8 @@
</div>
<mat-card>
<mat-card-content>
<app-process-attachments [processInstanceId]="currentProcessInstanceId" ></app-process-attachments>
<app-process-attachments
[processInstanceId]="currentProcessInstanceId"></app-process-attachments>
</mat-card-content>
</mat-card>
</div>
@ -213,7 +213,7 @@
</div>
</mat-tab>
<mat-tab id="report-header" href="#report"
label="{{'PS-TAB.REPORTS-TAB' | translate}}">
label="{{'PS-TAB.REPORTS-TAB' | translate}}">
<div class="adf-grid" fxLayout="row" fxLayout.lt-lg="column" fxLayoutAlign="stretch">
<div class="adf-grid-item adf-reports-menu" fxFlex.gt-md="300px">
<span><h5>Report List</h5></span>
@ -241,4 +241,23 @@
</div>
</div>
</mat-tab>
<mat-tab id="settings-header" href="#settings"
label="{{'PS-TAB.SETTINGS-TAB' | translate}}">
<div class="adf-grid" fxLayout="row" fxLayout.lt-lg="column" fxLayoutAlign="stretch">
<div class="adf-grid-item adf-settings-menu" fxFlex.gt-md="300px">
<span><h3>Settings Menu</h3></span>
</div>
<div class="adf-grid-item adf-settings-details" fxFlex.gt-md="1 1 auto">
<div>
<mat-slide-toggle id="adf-show-task-filter-icon" (change)="changeTaskFilterIcon()" [checked]="showTaskFilterIcon">Show task filters icons</mat-slide-toggle>
</div>
<div>
<mat-slide-toggle id="adf-show-process-filter-icon" (change)="changeProcessFilterIcon()" [checked]="showProcessFilterIcon">Show process filters icons</mat-slide-toggle>
</div>
<div>
<mat-slide-toggle id="adf-show-header" (change)="toggleHeaderContent()" [checked]="showHeaderContent">{{ 'PS-TAB.TASK-SHOW-HEADER'| translate }}</mat-slide-toggle>
</div>
</div>
</div>
</mat-tab>
</mat-tab-group>

4
demo-shell/src/app/components/process-service/process-service.component.scss
View File

@ -94,6 +94,10 @@
}
}
mat-slide-toggle {
margin: 10px;
}
@media screen and ($mat-small) {
container-widget .grid-list {
flex-direction: column;

9
demo-shell/src/app/components/process-service/process-service.component.ts
View File

@ -144,6 +144,9 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
showTaskTab: boolean;
showProcessTab: boolean;
showProcessFilterIcon: boolean;
showTaskFilterIcon: boolean;
fieldValidators = [
...FORM_FIELD_VALIDATORS,
new DemoFieldValidator()
@ -491,4 +494,10 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
this.currentTaskId = null;
}
changeTaskFilterIcon() {
this.showTaskFilterIcon = !this.showTaskFilterIcon;
}
changeProcessFilterIcon() {
this.showProcessFilterIcon = !this.showProcessFilterIcon;
}
}

5
e2e/pages/adf/process_services/appNavigationBarPage.js
View File

@ -22,6 +22,7 @@ var AppNavigationBarPage = function () {
var tasksButton = element.all(by.cssContainingText("div[class*='mat-tab-label'] .mat-tab-labels div", "Tasks")).first();
var processButton = element.all(by.cssContainingText("div[class*='mat-tab-label'] .mat-tab-labels div", "Process")).first();
var reportsButton = element.all(by.cssContainingText("div[class*='mat-tab-label'] .mat-tab-labels div", "Reports")).first();
var settingsButton = element.all(by.cssContainingText("div[class*='mat-tab-label'] .mat-tab-labels div", "Settings")).first();
var reportsButtonSelected = element.all(by.cssContainingText("div[class*='mat-tab-label'] .mat-tab-labels div[aria-selected='true']", "Reports")).first();
this.clickTasksButton = function () {
@ -33,6 +34,10 @@ var AppNavigationBarPage = function () {
return processButton.click();
};
this.clickSettingsButton = function () {
return settingsButton.click();
};
this.clickReportsButton = function () {
Util.waitUntilElementIsVisible(reportsButton);
reportsButton.click();

4
e2e/pages/adf/process_services/dialog/taskDetailsToggles.js
View File

@ -20,8 +20,8 @@ var ToggleState = require('../../core/toggleState');
var TaskDetailsToggles = function () {
var toggleState = new ToggleState();
var showDetailsHeaderToggle = element(by.id("showHeaderToggle-input"));
var showDetailsHeaderToggle = element(by.id('adf-show-header-input'));
this.enableShowHeader = function () {
toggleState.enableToggle(showDetailsHeaderToggle);

14
e2e/process-services/start_task_custom_app.e2e.ts
View File

@ -21,7 +21,7 @@ import LoginPage = require('../pages/adf/loginPage');
import ProcessServicesPage = require('../pages/adf/process_services/processServicesPage');
import TasksPage = require('../pages/adf/process_services/tasksPage');
import { AttachmentListPage } from '../pages/adf/process_services/attachmentListPage';
import CONSTANTS = require('../util/constants');
import AppNavigationBarPage = require('../pages/adf/process_services/appNavigationBarPage');
import Task = require('../models/APS/Task');
import Tenant = require('../models/APS/Tenant');
@ -39,12 +39,18 @@ import AlfrescoApi = require('alfresco-js-api-node');
import { AppsActions } from '../actions/APS/apps.actions';
import { UsersActions } from '../actions/users.actions';
import CONSTANTS = require('../util/constants');
describe('Start Task - Custom App', () => {
let TASKDATAFORMAT = 'mmm dd yyyy';
let loginPage = new LoginPage();
let processServicesPage = new ProcessServicesPage();
let attachmentListPage = new AttachmentListPage();
let appNavigationBarPage = new AppNavigationBarPage();
let processUserModel, assigneeUserModel;
let app = resources.Files.SIMPLE_APP_WITH_USER_FORM;
let formTextField = app.form_fields.form_fieldId;
@ -212,10 +218,16 @@ describe('Start Task - Custom App', () => {
taskPage.createNewTask().addName(showHeaderTask).clickStartButton();
taskPage.usingTasksListPage().checkTaskIsDisplayedInTasksList(showHeaderTask).selectTaskFromTasksList(showHeaderTask);
appNavigationBarPage.clickSettingsButton();
taskPage.usingTaskDetails().usingTaskDetailsToggles().disableShowHeader();
appNavigationBarPage.clickTasksButton();
taskPage.usingTaskDetails().taskInfoDrawerIsNotDisplayed();
appNavigationBarPage.clickSettingsButton();
taskPage.usingTaskDetails().usingTaskDetailsToggles().enableShowHeader();
appNavigationBarPage.clickTasksButton();
taskPage.usingTaskDetails().taskInfoDrawerIsDisplayed();
});

10
e2e/process-services/start_task_task_app.e2e.ts
View File

@ -21,6 +21,7 @@ import LoginPage = require('../pages/adf/loginPage');
import ProcessServicesPage = require('../pages/adf/process_services/processServicesPage');
import TasksPage = require('../pages/adf/process_services/tasksPage');
import { AttachmentListPage } from '../pages/adf/process_services/attachmentListPage';
import AppNavigationBarPage = require('../pages/adf/process_services/appNavigationBarPage');
import CONSTANTS = require('../util/constants');
@ -43,9 +44,12 @@ import path = require('path');
describe('Start Task - Task App', () => {
let TASKDATAFORMAT = 'mmm dd yyyy';
let loginPage = new LoginPage();
let processServicesPage = new ProcessServicesPage();
let attachmentListPage = new AttachmentListPage();
let appNavigationBarPage = new AppNavigationBarPage();
let processUserModel, assigneeUserModel;
let app = resources.Files.SIMPLE_APP_WITH_USER_FORM;
let formTextField = app.form_fields.form_fieldId;
@ -215,10 +219,16 @@ describe('Start Task - Task App', () => {
taskPage.usingFiltersPage().goToFilter(CONSTANTS.TASKFILTERS.MY_TASKS);
taskPage.usingTasksListPage().checkTaskIsDisplayedInTasksList(showHeaderTask).selectTaskFromTasksList(showHeaderTask);
appNavigationBarPage.clickSettingsButton();
taskPage.usingTaskDetails().usingTaskDetailsToggles().disableShowHeader();
appNavigationBarPage.clickTasksButton();
taskPage.usingTaskDetails().taskInfoDrawerIsNotDisplayed();
appNavigationBarPage.clickSettingsButton();
taskPage.usingTaskDetails().usingTaskDetailsToggles().enableShowHeader();
appNavigationBarPage.clickTasksButton();
taskPage.usingTaskDetails().taskInfoDrawerIsDisplayed();
});

1
lib/process-services/process-list/components/process-filters.component.spec.ts
View File

@ -77,6 +77,7 @@ describe('ProcessFiltersComponent', () => {
processFilterService = TestBed.get(ProcessFilterService);
appsProcessService = TestBed.get(AppsProcessService);
filterList = new ProcessFiltersComponent(processFilterService, appsProcessService);
});
afterEach(() => {