src/lib/how/sz-how-entity.component.ts
Display the "How" information for entity
Example :<!-- (Angular) -->
<sz-how-entity entityId="5"></sz-how-entity><!-- (WC) -->
<sz-wc-how-entity entityId="5"></sz-wc-how-entity>
OnInit
OnDestroy
| selector | sz-how-entity |
| styleUrls | ./sz-how-entity.component.scss |
| templateUrl | ./sz-how-entity.component.html |
Properties |
|
Methods |
Inputs |
Outputs |
Accessors |
constructor(entityDataService: SzEntityDataService, configDataService: SzConfigDataService, dialog: MatDialog, howUIService: SzHowUIService)
|
|||||||||||||||
|
Parameters :
|
| entityId |
Type : SzEntityIdentifier
|
|
the entity id of the entity to display the How report for |
| showNavigation |
Type : boolean | string
|
|
whether or not to show the navigation rail |
| dataChanged |
Type : EventEmitter
|
|
when the data has changed this event is emitted |
| loading |
Type : EventEmitter<boolean>
|
|
when the entity id has changed and a data request response is pending this event is emitted |
| virtualEntitiesDataChanged |
Type : EventEmitter
|
|
when the map of virtual entities found in the api response is returned from subsequent queries is returned this event is emitted |
| virtualEntityInfoLinkClicked |
Type : EventEmitter
|
|
when a user clicks the info link inside of a step card this event is emitted |
| isStepMemberOfStack | ||||
isStepMemberOfStack(vId)
|
||||
|
is a specific step a member of a stack group
Parameters :
Returns :
any
|
| ngOnDestroy |
ngOnDestroy()
|
|
unsubscribe when component is destroyed
Returns :
void
|
| ngOnInit |
ngOnInit()
|
|
get data and set up event subscribers on initialization
Returns :
void
|
| stepCanBeUnPinned | ||||
stepCanBeUnPinned(vId)
|
||||
|
if step can be a member of a stack group returns true
Parameters :
Returns :
any
|
| Public stepIsMemberOfGroup | |||||||||
stepIsMemberOfGroup(virtualEntityId: string, nodesWithChildren: Map<string | SzResolutionStepNode>)
|
|||||||||
|
is a specific step a child of any other steps
Parameters :
Returns :
boolean
|
| stepIsMemberOfGroupDebug |
stepIsMemberOfGroupDebug(virtualEntityId: string, debug?: boolean)
|
|
Returns :
boolean
|
| Public configDataService |
Type : SzConfigDataService
|
| Public dataChange |
Default value : this._dataChange.asObservable()
|
|
when the data has changed this event is emitted |
| Public dialog |
Type : MatDialog
|
| Public entityDataService |
Type : SzEntityDataService
|
| Public entityIdChange |
Default value : this._entityIdChange.asObservable()
|
|
when the entity id passed to this component has changed this event is emitted |
| Public finalCardsData |
Type : SzVirtualEntity[]
|
|
the data retrieved from the 'finalStates' array of the how api request. passed to other components. |
| Public finalEntitiesChange |
Default value : this._finalEntitiesChange.asObservable()
|
|
when the final entities are returned from the api request this event is emitted |
| Public unsubscribe$ |
Default value : new Subject<void>()
|
|
subscription to notify subscribers to unbind |
| Public virtualEntityInfoLinkClick |
Default value : this._virtualEntityInfoLinkClick.asObservable()
|
|
when a user clicks the info link inside of a step card this event is emitted |
| entityId | ||||||
getentityId()
|
||||||
|
the entity id of the entity to display the How report for
Returns :
SzEntityIdentifier
|
||||||
setentityId(value: SzEntityIdentifier)
|
||||||
|
the entity id of the entity to display the How report for
Parameters :
Returns :
void
|
| isLoading |
getisLoading()
|
|
when the entity id has changed and a data request response is pending this event is emitted
Returns :
boolean
|
| showNavigation | ||||||
getshowNavigation()
|
||||||
|
whether or not to show the navigation rail
Returns :
boolean
|
||||||
setshowNavigation(value: boolean | string)
|
||||||
|
whether or not to show the navigation rail
Parameters :
Returns :
void
|
| stepNodes |
getstepNodes()
|
|
get the steps returned from the main api request as extended 'SzResolutionStepNode' objects. the extended objects are recursive, nested, grouped etc and used for display.
Returns :
Array<SzResolutionStepNode>
|
| resolutionStepsByVirtualId |
getresolutionStepsByVirtualId()
|
|
resolutionSteps from the api response object |
| virtualEntitiesById |
getvirtualEntitiesById()
|
|
map of virtual entities by id
Returns :
Map<string, SzResolvedVirtualEntity>
|
<sz-how-nav
[stepsByVirtualId]="resolutionStepsByVirtualId"
[virtualEntitiesById]="virtualEntitiesById"
*ngIf="showNavigation"
></sz-how-nav>
<div class="main">
<sz-how-step-node *ngFor="let finalCardStepNode of stepNodes; let rsInd=index"
[attr.step-index]="rsInd"
[attr.step-number]="finalCardStepNode.stepNumber"
[attr.virtual-id]="finalCardStepNode.resolvedVirtualEntityId"
[data]="finalCardStepNode"
[virtualEntitiesById]="virtualEntitiesById"></sz-how-step-node>
</div>
./sz-how-entity.component.scss
:host {
display: flex;
flex-direction: row;
justify-items: flex-start;
height: 100%;
padding-right: 24px;
sz-how-nav {
}
.main {
justify-items: flex-start;
flex-grow: 10;
margin: 10px 20px;
}
.step-list {
list-style: none;
li {
display: flex;
flex-direction: row;
margin-left: 40px;
&.top-level {
margin-left: 0px;
sz-how-final-entity-card {
flex-grow: 5;
}
}
&.hidden {
display: none;
}
sz-how-step-node {
flex-grow: 5;
}
}
}
&.has-child-stacks {
padding-right: 0;
sz-how-final-entity-card,
sz-how-step-node {
margin-right: 24px;
&.is-stack {
margin-right: 4px;
}
}
}
.debug-box {
position: relative;
border: 1px inset #b1b1b1;
border-radius: 4px;
margin: 0 2px 2px 0;
padding: 22px 20px 14px;
button {
margin-left: 5px;
}
h3 {
position: absolute;
top: -32px;
background-color: #fff;
padding: 0px 10px 0px 10px;
}
}
}