diff --git a/demo-shell-ng2/app/components/activiti/activiti-demo.component.css b/demo-shell-ng2/app/components/activiti/activiti-demo.component.css new file mode 100644 index 0000000000..0258de8fe1 --- /dev/null +++ b/demo-shell-ng2/app/components/activiti/activiti-demo.component.css @@ -0,0 +1,4 @@ +.activiti-task-list__item:hover { + cursor: pointer; + font-weight: bold; +} diff --git a/demo-shell-ng2/app/components/activiti/activiti-demo.component.html b/demo-shell-ng2/app/components/activiti/activiti-demo.component.html new file mode 100644 index 0000000000..6d722b311e --- /dev/null +++ b/demo-shell-ng2/app/components/activiti/activiti-demo.component.html @@ -0,0 +1,22 @@ +
+ +
+
No tasks found
+
+
    +
  • + + launch + {{task.name}} + +
+
+
+ +
+ +
+ +
diff --git a/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts b/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts index 4a60f1f811..ef92b8999d 100644 --- a/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts +++ b/demo-shell-ng2/app/components/activiti/activiti-demo.component.ts @@ -15,16 +15,45 @@ * limitations under the License. */ -import { Component } from '@angular/core'; -import { ActivitiForm } from 'ng2-alfresco-activiti-form'; +import { Component, OnInit, AfterViewChecked } from '@angular/core'; +import { ActivitiForm, FormService } from 'ng2-alfresco-activiti-form'; + + +declare let __moduleName: string; +declare var componentHandler; @Component({ + moduleId: __moduleName, selector: 'activiti-demo', - template: ` - - `, - directives: [ActivitiForm] + templateUrl: './activiti-demo.component.html', + styleUrls: ['./activiti-demo.component.css'], + directives: [ActivitiForm], + providers: [FormService] }) -export class ActivitiDemoComponent { +export class ActivitiDemoComponent implements OnInit, AfterViewChecked { + + tasks: any[] = []; + selectedTask: any; + + hasTasks(): boolean { + return this.tasks && this.tasks.length > 0; + } + + constructor(private formService: FormService) {} + + ngOnInit() { + this.formService.getTasks().subscribe(val => this.tasks = val || []); + } + + ngAfterViewChecked() { + // workaround for MDL issues with dynamic components + if (componentHandler) { + componentHandler.upgradeAllRegistered(); + } + } + + onTaskClicked(task, e) { + this.selectedTask = task; + } } diff --git a/ng2-components/ng2-alfresco-activiti-form/README.md b/ng2-components/ng2-alfresco-activiti-form/README.md index a171d5e87d..f1932d2598 100644 --- a/ng2-components/ng2-alfresco-activiti-form/README.md +++ b/ng2-components/ng2-alfresco-activiti-form/README.md @@ -1,3 +1,7 @@ # Alfresco Activiti Form component for Angular 2 -TBD \ No newline at end of file +TBD + +```html + +``` \ No newline at end of file diff --git a/ng2-components/ng2-alfresco-activiti-form/index.ts b/ng2-components/ng2-alfresco-activiti-form/index.ts index 39165e6094..f57a867f26 100644 --- a/ng2-components/ng2-alfresco-activiti-form/index.ts +++ b/ng2-components/ng2-alfresco-activiti-form/index.ts @@ -16,3 +16,5 @@ */ export * from './src/components/activiti-form.component'; +export * from './src/services/form.service'; +export * from './src/components/widgets/index'; diff --git a/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.css b/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.css index 29ecfb889c..34500e7278 100644 --- a/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.css +++ b/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.css @@ -7,12 +7,6 @@ background-color: #fff; } -.activiti-task-list__item:hover { - cursor: pointer; - font-weight: bold; -} - - .activiti-form-debug-container { padding: 10px; } diff --git a/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.html b/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.html index 07d7c3babc..f1e15c3e6d 100644 --- a/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.html +++ b/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.html @@ -1,53 +1,38 @@ -
- -
-
No tasks found
-
-
    -
  • - - launch - {{task.name}} - -
-
+
+
+

Please select a Task

+
-
-
-

Please select a Task

-
-
+
+
+

{{form.taskName}}

+
+
+
+ +
-
-
-

{{task.name}}

-
-
-
- -
- -
- -
-
-
- +
+
+
+ +
-
+
diff --git a/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.ts b/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.ts index 9cca8cd473..544f8e6687 100644 --- a/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.ts +++ b/ng2-components/ng2-alfresco-activiti-form/src/components/activiti-form.component.ts @@ -17,8 +17,9 @@ import { Component, - OnInit, - AfterViewChecked + OnInit, AfterViewChecked, OnChanges, + SimpleChange, + Input } from '@angular/core'; import { MATERIAL_DESIGN_DIRECTIVES } from 'ng2-alfresco-core'; @@ -39,26 +40,24 @@ declare var componentHandler; directives: [MATERIAL_DESIGN_DIRECTIVES, ContainerWidget, TabsWidget], providers: [FormService] }) -export class ActivitiForm implements OnInit, AfterViewChecked { +export class ActivitiForm implements OnInit, AfterViewChecked, OnChanges { + + @Input() + taskId: string; - task: any; form: FormModel; - tasks: any[] = []; - debugMode: boolean = false; hasForm(): boolean { return this.form ? true : false; } - hasTasks(): boolean { - return this.tasks && this.tasks.length > 0; - } - constructor(private formService: FormService) {} ngOnInit() { - this.formService.getTasks().subscribe(val => this.tasks = val || []); + if (this.taskId) { + this.loadForm(this.taskId); + } } ngAfterViewChecked() { @@ -68,14 +67,14 @@ export class ActivitiForm implements OnInit, AfterViewChecked { } } - onTaskClicked(task, e) { - // alert(`Task: ${task.name} clicked.`); - this.task = task; - this.formService - .getTaskForm(task.id) - .subscribe(form => this.form = new FormModel(form)); + ngOnChanges(changes: {[propertyName: string]: SimpleChange}) { + let taskId = changes['taskId']; + if (taskId && taskId.currentValue) { + this.loadForm(taskId.currentValue); + } } + onOutcomeClicked(outcome: FormOutcomeModel, event?: Event) { if (outcome) { if (outcome.isSystem) { @@ -87,6 +86,15 @@ export class ActivitiForm implements OnInit, AfterViewChecked { } } + private loadForm(taskId: string) { + this.formService + .getTaskForm(taskId) + .subscribe( + form => this.form = new FormModel(form), + err => console.log(err) + ); + } + private saveTaskForm() { let form = { values: this.form.values