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;
}