C:/GoDev/src/TCSTK-Angular/projects/tibco-tcstk/tc-liveapps-lib/src/lib/components/live-apps-case-actions-list/live-apps-case-actions-list.component.ts
Special (option list) rendering of LiveAppsCaseActionsComponent
<tcla-live-apps-case-actions-list></tcla-live-apps-case-actions-list>
| selector | tcla-live-apps-case-actions-list |
| styleUrls | ./live-apps-case-actions-list.component.css |
| templateUrl | ./live-apps-case-actions-list.component.html |
Properties |
|
Methods |
Inputs |
Outputs |
HostListeners |
Accessors |
| formFieldRendering | |
Type : boolean
|
|
| label | |
Type : string
|
|
| seletedActionId | |
Type : string
|
|
|
Pre-select specified actionId |
|
| actionFilter | |
Type : string[]
|
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
|
Defined in
LiveAppsCaseActionsComponent:70
|
|
|
Dont show buttons for any actions that start with this string. eg: '$' will remove the action $Update |
|
| appId | |
Type : string
|
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
|
Defined in
LiveAppsCaseActionsComponent:34
|
|
|
The LA Application Id |
|
| caseRef | |
Type : string
|
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
|
Defined in
LiveAppsCaseActionsComponent:29
|
|
|
The case reference |
|
| loadOnDemand | |
Type : boolean
|
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
|
Defined in
LiveAppsCaseActionsComponent:40
|
|
| maxActions | |
Default value : 1
|
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
|
Defined in
LiveAppsCaseActionsComponent:64
|
|
|
Max Actions that can be run simultaneously |
|
| sandboxId | |
Type : number
|
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
|
Defined in
LiveAppsCaseActionsComponent:59
|
|
|
sandboxId - this comes from claims resolver |
|
| typeId | |
Type : string
|
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
|
Defined in
LiveAppsCaseActionsComponent:50
|
|
| actionClicked | |
Type : EventEmitter<LaProcessSelection>
|
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
|
Defined in
LiveAppsCaseActionsComponent:76
|
|
|
~event actionClicked : Case Action selected ~payload LaProcessSelection : LaProcessSelection object output when an action is clicked (ie. message to parent to run action component) |
|
| window:resize |
Arguments : '$event'
|
window:resize(event)
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:45
|
| window:resize |
Arguments : '$event'
|
window:resize(event)
|
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:45
|
| ngOnChanges | ||||||
ngOnChanges(changes: SimpleChanges)
|
||||||
|
Parameters :
Returns :
void
|
| Public selectAction | ||||||
selectAction(action: CaseAction)
|
||||||
|
Parameters :
Returns :
void
|
| loadActions | ||||
loadActions(event)
|
||||
|
Inherited from
LiveAppsCaseActionsComponent
|
||||
|
Defined in
LiveAppsCaseActionsComponent:149
|
||||
|
Parameters :
Returns :
void
|
| ngOnInit |
ngOnInit()
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:143
|
|
Returns :
void
|
| Public selectAction | ||||||
selectAction(action: CaseAction)
|
||||||
|
Inherited from
LiveAppsCaseActionsComponent
|
||||||
|
Defined in
LiveAppsCaseActionsComponent:121
|
||||||
|
Parameters :
Returns :
void
|
| ngAfterViewInit |
ngAfterViewInit()
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:91
|
|
Returns :
void
|
| ngOnDestroy |
ngOnDestroy()
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:99
|
|
Returns :
void
|
| ngOnInit |
ngOnInit()
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:104
|
|
Returns :
void
|
| setupWidthObserver |
setupWidthObserver()
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:70
|
|
Returns :
void
|
| ngAfterViewInit |
ngAfterViewInit()
|
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:91
|
|
Returns :
void
|
| ngOnDestroy |
ngOnDestroy()
|
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:99
|
|
Returns :
void
|
| ngOnInit |
ngOnInit()
|
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:104
|
|
Returns :
void
|
| setupWidthObserver |
setupWidthObserver()
|
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:70
|
|
Returns :
void
|
| caseActionList |
Type : Process[]
|
| compareObjects |
Default value : () => {...}
|
| Public formFieldRendering |
Type : boolean
|
Default value : false
|
|
Use Form field rendering around the selection box |
| Public label |
Type : string
|
Default value : 'Case Actions'
|
|
Label for the actions selector |
| Public refresh |
Default value : () => {...}
|
| selectedAction |
Type : Process
|
| appSchema |
Type : CaseTypesList
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:83
|
| caseActionList |
Type : Process[]
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:85
|
| Public caseactions |
Type : CaseAction[]
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:78
|
| caseType |
Type : CaseType
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:84
|
| Public disabled |
Default value : false
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:80
|
| Public errorMessage |
Type : string
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:79
|
| Public isLoading |
Default value : true
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:81
|
| Public loadOnDemand |
Type : boolean
|
Default value : false
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:39
|
|
Whether to load actions on component load. Default false. |
| Public refresh |
Default value : () => {...}
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:91
|
| Public toggleEnable |
Default value : () => {...}
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:117
|
| Public typeId |
Type : string
|
Default value : '1'
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:49
|
|
The LA Application Type Id (generally 1) |
| Protected _destroyed$ |
Default value : new Subject()
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:39
|
| componentChildDivs |
Type : LiveAppsComponent[]
|
Decorators :
@ViewChildren('componentChildDiv')
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:36
|
| componentDiv |
Type : ElementRef
|
Decorators :
@ViewChild('componentDiv', {static: false})
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:35
|
| Protected containerChanges$ |
Type : Observable<TcComponent>
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:40
|
| Private observer |
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:42
|
| Public resize |
Default value : () => {...}
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:56
|
| Public widget |
Type : TcComponent
|
|
Inherited from
LiveAppsCaseActionsComponent
|
|
Defined in
LiveAppsCaseActionsComponent:41
|
| Protected _destroyed$ |
Default value : new Subject()
|
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:39
|
| componentChildDivs |
Type : LiveAppsComponent[]
|
Decorators :
@ViewChildren('componentChildDiv')
|
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:36
|
| componentDiv |
Type : ElementRef
|
Decorators :
@ViewChild('componentDiv', {static: false})
|
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:35
|
| Protected containerChanges$ |
Type : Observable<TcComponent>
|
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:40
|
| Private observer |
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:42
|
| Public resize |
Default value : () => {...}
|
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:56
|
| Public widget |
Type : TcComponent
|
|
Inherited from
LiveAppsComponent
|
|
Defined in
LiveAppsComponent:41
|
| FormFieldRendering | ||||||
setFormFieldRendering(formFieldRendering: boolean)
|
||||||
|
Parameters :
Returns :
void
|
| Label | ||||||
setLabel(label: string)
|
||||||
|
Parameters :
Returns :
void
|
import { Component, OnInit, Input, OnChanges, SimpleChanges, Output, EventEmitter } from '@angular/core';
import { LiveAppsService } from '../../services/live-apps.service';
import { map, takeUntil, take, tap } from 'rxjs/operators';
import { Process, CaseAction } from '../../models/liveappsdata';
import { LaProcessSelection } from '../../models/tc-case-processes';
import { LiveAppsCaseActionsComponent } from '../live-apps-case-actions/live-apps-case-actions.component';
/**
* Special (option list) rendering of LiveAppsCaseActionsComponent
*
*@example <tcla-live-apps-case-actions-list></tcla-live-apps-case-actions-list>
*/
@Component({
selector: 'tcla-live-apps-case-actions-list',
templateUrl: './live-apps-case-actions-list.component.html',
styleUrls: ['./live-apps-case-actions-list.component.css']
})
export class LiveAppsCaseActionsListComponent extends LiveAppsCaseActionsComponent implements OnInit, OnChanges {
/**
* Pre-select specified actionId
*/
@Input() seletedActionId: string;
/**
* Use Form field rendering around the selection box
*/
public formFieldRendering: boolean = false;
@Input('formFieldRendering') set FormFieldRendering(formFieldRendering: boolean) {
if (formFieldRendering){
this.formFieldRendering = formFieldRendering;
}
}
/**
* Label for the actions selector
*/
public label: string = 'Case Actions';
@Input('label') set Label(label: string) {
if (label){
this.label = label;
}
}
caseActionList: Process[];
selectedAction: Process;
public refresh = () => {
// retrieve the schema for this case type so we can display case creators and case actions for this case type
this.liveapps.getCaseTypeSchema(this.sandboxId, this.appId, 100)
.subscribe(schema => {
// this.appSchema = schema;
schema.casetypes.forEach((casetype) => {
// the schema will contain definitions for both the 'case' and any defined types in that case.
// We want the schema for this 'case'.
if (casetype.applicationId === this.appId && casetype.id === this.typeId) {
if (casetype.jsonSchema !== undefined) {
// this.caseType = casetype;
this.caseActionList = casetype.actions ? casetype.actions : [];
// if (this.caseActionList.length == 1) {
// this.selectProcess(this.caseActionList[0]);
// }
} else {
console.error('No schema returned for this case type: You may need to update/re-deploy the live apps application');
}
}
}
);
});
}
ngOnChanges(changes: SimpleChanges) {
if (changes.appId && (changes.appId.currentValue !== changes.appId.previousValue)) {
this.caseActionList = [];
this.refresh();
}
}
compareObjects = (o1: any, o2: any): boolean => {
return o1.id === this.seletedActionId;
}
public selectAction(action: CaseAction) {
this.caseProcessesService.getProcessDetails(this.caseRef, this.appId, this.typeId, this.sandboxId, action, null, 100).pipe(
take(1),
takeUntil(this._destroyed$),
tap(processDetails => {
if (!processDetails || !processDetails.process) {
// This will be triggered when no form schema is available
// Typically happens when:
// 1) The form has elements that are not supported by the Live Apps API for form schemas such as participant selectors
// 2) The Live Apps application is legacy and has no form schema at all, redeploying the live apps application would fix this.
console.error('No schema available for this case type: The form may not be supported or you may need to update/re-deploy the live apps application');
}
}
)
)
.subscribe(processSchema => {
this.actionClicked.emit(processSchema);
return processSchema;
}, error => { this.errorMessage = 'Error retrieving case actions: ' + error.error.errorMsg; });
}
}
<div *ngIf="!formFieldRendering" fxFlex style="margin-left: 10px;">
<mat-select class="tcs-action-selector-option" [disableOptionCentering]="true" [(ngModel)]="selectedAction" [compareWith]="compareObjects"
placeholder="{{label}}" >
<mat-option *ngFor="let action of caseActionList" [value]="action" (click)="selectAction(action)">
<span>{{action.name}}</span>
</mat-option>
</mat-select>
</div>
<div *ngIf="formFieldRendering" fxFlex>
<mat-form-field style="width:100%" class="tcs-action-selector-option-ff">
<mat-label>{{label}}</mat-label>
<mat-select class="tcs-action-selector-option-formfield" [disableOptionCentering]="true" [(ngModel)]="selectedAction" [compareWith]="compareObjects"
placeholder="{{label}}" >
<mat-option *ngFor="let action of caseActionList" [value]="action" (click)="selectAction(action)">
<span>{{action.name}}</span>
</mat-option>
</mat-select>
</mat-form-field>
</div>
./live-apps-case-actions-list.component.css
:host ::ng-deep .tcs-action-selector-option .mat-select-value span {
font-family: Source Sans Pro;
font-size: 16px;
font-weight: normal;
font-style: normal;
font-stretch: normal;
line-height: 1.5;
letter-spacing: 0.3px;
color: #0081cb;
}
:host ::ng-deep .tcs-action-selector-option .mat-select-arrow-wrapper div {
color: #0081cb;
}
:host ::ng-deep .tcs-action-selector-option .mat-select-value {
min-width: 100px;
max-width: 100%;
width: auto;
}
.tcs-actions-box {
width: 200px;
height: 44px;
box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5);
background-color: #ffffff;
}
tcs-action-selector-option {
width: 170px;
margin-left: 5px;
margin-right: 5px;
height: 20px;
background-color: #eeeeee;
padding-left: 20px;
padding-right: 20px;
height: 35px;
}
.tcs-case-creation-dialog-instruction {
font-family: Source Sans Pro;
font-size: 16px;
font-weight: 600;
font-style: normal;
font-stretch: normal;
line-height: normal;
letter-spacing: normal;
color:#727272;
}