aboutsummaryrefslogtreecommitdiff
path: root/app/components/plan-node/plan-node.html
diff options
context:
space:
mode:
authorAlex Tatiyants <atatiyan@gmail.com>2016-01-04 21:32:55 -0800
committerAlex Tatiyants <atatiyan@gmail.com>2016-01-04 21:32:55 -0800
commit9554ab8c51c0a5853a58be98936223908eabcbb9 (patch)
tree5a6635bbaecabd593981a71ca6ce63632482903a /app/components/plan-node/plan-node.html
parentd89ddcf3532937d395898f255c42f3d26303f1c4 (diff)
add node descriptions, clean up plan-node.ts
Diffstat (limited to 'app/components/plan-node/plan-node.html')
-rw-r--r--app/components/plan-node/plan-node.html40
1 files changed, 25 insertions, 15 deletions
diff --git a/app/components/plan-node/plan-node.html b/app/components/plan-node/plan-node.html
index ddf6722..08a7a96 100644
--- a/app/components/plan-node/plan-node.html
+++ b/app/components/plan-node/plan-node.html
@@ -1,26 +1,30 @@
-<div class="plan-node">
+<div class="plan-node" [class.expanded]="showDetails">
<header (click)="showDetails = !showDetails">
- <h4>{{node['Node Type'] | uppercase}}
+ <h4>{{node[_planService.NODE_TYPE_PROP] | uppercase}}
</h4>
<span class="node-duration">{{duration}}<span class="text-muted">{{durationUnit}} | </span>
<strong>{{executionTimePercent}}</strong><span class="text-muted">%</span>
</span>
</header>
- <div class="relation-name" *ngIf="node['Relation Name']">
+ <div class="relation-name" *ngIf="node[_planService.RELATION_NAME_PROP]">
<button *ngIf="plan.formattedQuery" class="btn btn-sm btn-default btn-slim pull-right" (click)="showQuery = !showQuery">
<i class="fa fa-database"></i>
</button>
<span class="text-muted">on </span>
- <span *ngIf="node['Schema']">{{node['Schema']}}.</span>{{node['Relation Name']}}
- <span *ngIf="node['Alias']"> ({{node['Alias']}})</span>
+ <span *ngIf="node[_planService.SCHEMA_PROP]">{{node[_planService.SCHEMA_PROP]}}.</span>{{node[_planService.RELATION_NAME_PROP]}}
+ <span *ngIf="node[_planService.ALIAS_PROP]"> ({{node[_planService.ALIAS_PROP]}})</span>
</div>
- <div class="relation-name" *ngIf="node['Group Key']"><span class="text-muted">by</span> {{node['Group Key']}}</div>
- <div class="relation-name" *ngIf="node['Sort Key']"><span class="text-muted">by</span> {{node['Sort Key']}}</div>
- <div class="relation-name" *ngIf="node['Join Type']">{{node['Join Type']}} <span class="text-muted">join</span></div>
- <div class="relation-name" *ngIf="node['Index Name']"><span class="text-muted">using</span> {{node['Index Name']}}</div>
+ <div class="relation-name" *ngIf="node[_planService.GROUP_KEY_PROP]">
+ <span class="text-muted">by</span> {{node[_planService.GROUP_KEY_PROP]}}</div>
+ <div class="relation-name" *ngIf="node[_planService.SORT_KEY_PROP]">
+ <span class="text-muted">by</span> {{node[_planService.SORT_KEY_PROP]}}</div>
+ <div class="relation-name" *ngIf="node[_planService.JOIN_TYPE_PROP]">{{node[_planService.JOIN_TYPE_PROP]}}
+ <span class="text-muted">join</span></div>
+ <div class="relation-name" *ngIf="node[_planService.INDEX_NAME_PROP]"><span class="text-muted">
+ using</span> {{node[_planService.INDEX_NAME_PROP]}}</div>
<div class="tags" *ngIf="viewOptions.showTags && tags.length > 0">
<span *ngFor="#tag of tags">{{tag}}</span>
@@ -41,12 +45,18 @@
<span> by <strong>{{plannerRowEstimateValue}}</strong>x</span>
</div>
- <table *ngIf="showDetails" class="table prop-list">
- <tr *ngFor="#prop of props">
- <td width="40%">{{prop.key}}</td>
- <td>{{prop.value}}</td>
- <tr>
- </table>
+ <div *ngIf="showDetails">
+ <div *ngIf="getNodeTypeDescription()" class="node-description">
+ <span class="node-type">{{node[_planService.NODE_TYPE_PROP]}} Node</span> <span [innerHtml]="getNodeTypeDescription()"></span>
+ </div>
+
+ <table class="table prop-list">
+ <tr *ngFor="#prop of props">
+ <td width="40%">{{prop.key}}</td>
+ <td>{{prop.value}}</td>
+ <tr>
+ </table>
+ </div>
<div *ngIf="showQuery" class="plan-query-container">
<button class="btn btn-close pull-right" (click)="showQuery = false">