Repository: incubator-griffin Updated Branches: refs/heads/master d70751710 -> 459c96654
Show profiling results and fix some bugs Show profiling results and fix some bugs Author: dodobel <1254288...@qq.com> Closes #208 from dodobel/master. Project: http://git-wip-us.apache.org/repos/asf/incubator-griffin/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-griffin/commit/459c9665 Tree: http://git-wip-us.apache.org/repos/asf/incubator-griffin/tree/459c9665 Diff: http://git-wip-us.apache.org/repos/asf/incubator-griffin/diff/459c9665 Branch: refs/heads/master Commit: 459c96654b2322cdd29c3d6fe22a2825ffb35167 Parents: d707517 Author: dodobel <1254288...@qq.com> Authored: Mon Feb 5 13:02:54 2018 +0800 Committer: Lionel Liu <bhlx3l...@163.com> Committed: Mon Feb 5 13:02:54 2018 +0800 ---------------------------------------------------------------------- ui/angular/src/app/health/health.component.ts | 34 ++++---- ui/angular/src/app/job/job.component.ts | 1 + .../measure/create-measure/ac/ac.component.css | 2 +- .../measure/create-measure/ac/ac.component.html | 2 +- .../measure/create-measure/pr/pr.component.ts | 33 +++---- .../measure-detail.component.html | 6 +- .../measure-detail/measure-detail.component.ts | 16 ++-- .../detail-metric/detail-metric.component.css | 86 ++++++++++++++++++- .../detail-metric/detail-metric.component.html | 55 ++++++++++++ .../detail-metric/detail-metric.component.ts | 50 +++++++---- ui/angular/src/app/metric/metric.component.ts | 57 ++++++++---- ui/angular/src/app/service/chart.service.ts | 11 ++- ui/angular/src/app/sidebar/sidebar.component.ts | 34 ++++---- ui/angular/src/assets/img/table.png | Bin 0 -> 882 bytes 14 files changed, 289 insertions(+), 98 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/health/health.component.ts ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/health/health.component.ts b/ui/angular/src/app/health/health.component.ts index 37cadd5..bd78065 100644 --- a/ui/angular/src/app/health/health.component.ts +++ b/ui/angular/src/app/health/health.component.ts @@ -188,22 +188,24 @@ export class HealthComponent implements OnInit { metricData.metricValues[0].value.matched != undefined ) { for(let i=0;i<jobs.length;i++){ - var metricNode = { - name: "", - timestamp: "", - dq: 0, - details: [] - }; - metricNode.details = JSON.parse( - JSON.stringify(jobs[i].metricValues) - ); - metricNode.name = jobs[i].name; - metricNode.timestamp = jobs[i].metricValues[0].value.tmst; - metricNode.dq = - jobs[i].metricValues[0].value.matched / - jobs[i].metricValues[0].value.total * - 100; - node.metrics.push(metricNode); + if(jobs[i].metricValues.length != 0){ + var metricNode = { + name: "", + timestamp: "", + dq: 0, + details: [] + }; + metricNode.details = JSON.parse( + JSON.stringify(jobs[i].metricValues) + ); + metricNode.name = jobs[i].name; + metricNode.timestamp = jobs[i].metricValues[0].value.tmst; + metricNode.dq = + jobs[i].metricValues[0].value.matched / + jobs[i].metricValues[0].value.total * + 100; + node.metrics.push(metricNode); + } } } this.finalData.push(node); http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/job/job.component.ts ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/job/job.component.ts b/ui/angular/src/app/job/job.component.ts index f394527..2871c5c 100644 --- a/ui/angular/src/app/job/job.component.ts +++ b/ui/angular/src/app/job/job.component.ts @@ -105,6 +105,7 @@ export class JobComponent implements OnInit { this.http.get(getInstanceUrl).subscribe(data => { row.showDetail = !row.showDetail; this.allInstances = data; + console.log(this.allInstances); setTimeout(function() { $(".pagination").css("marginBottom", "-10px"); }, 0); http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/measure/create-measure/ac/ac.component.css ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/measure/create-measure/ac/ac.component.css b/ui/angular/src/app/measure/create-measure/ac/ac.component.css index a0d11bf..80b9b91 100644 --- a/ui/angular/src/app/measure/create-measure/ac/ac.component.css +++ b/ui/angular/src/app/measure/create-measure/ac/ac.component.css @@ -117,4 +117,4 @@ div.tree>treenode>div::before { div.tree>treenode>div>.node-wrapper>treenodeexpander>.toggle-children-wrapper { left: 22px -} +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/measure/create-measure/ac/ac.component.html ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/measure/create-measure/ac/ac.component.html b/ui/angular/src/app/measure/create-measure/ac/ac.component.html index 1cf708c..eb39a70 100644 --- a/ui/angular/src/app/measure/create-measure/ac/ac.component.html +++ b/ui/angular/src/app/measure/create-measure/ac/ac.component.html @@ -407,7 +407,7 @@ under the License. </div> <div class="row"> <div class="col-lg-12 col-md-12 col-sm-12"> - <div id="viewrule-definition" class="viewrule-content"> + <div id="viewrule-definition" class="viewrule-content y-scrollable"> <div class="row"> <label class="col-md-4 col-lg-4 col-sm-4"> Measure Name: http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/measure/create-measure/pr/pr.component.ts ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/measure/create-measure/pr/pr.component.ts b/ui/angular/src/app/measure/create-measure/pr/pr.component.ts index 1c6c927..1d108a9 100644 --- a/ui/angular/src/app/measure/create-measure/pr/pr.component.ts +++ b/ui/angular/src/app/measure/create-measure/pr/pr.component.ts @@ -107,11 +107,8 @@ export class PrComponent implements AfterViewChecked, OnInit { desc: string; owner = "test"; currentDBstr: string; - rulenode = { - name: "", - noderules: "" - }; timezone = ""; + ruledesc = ""; newMeasure = { name: "", "measure.type": "griffin", @@ -119,6 +116,9 @@ export class PrComponent implements AfterViewChecked, OnInit { "process.type": "batch", owner: "", description: "", + "rule.description": { + details:[] + }, // "group":[], "data.sources": [ { @@ -154,7 +154,7 @@ export class PrComponent implements AfterViewChecked, OnInit { "dsl.type": "griffin-dsl", "dq.type": "profiling", rule: "", - description: "", + // description: "", name: "", details: { // "profiling": { @@ -393,6 +393,9 @@ export class PrComponent implements AfterViewChecked, OnInit { name: this.name, "measure.type": "griffin", "dq.type": "profiling", + "rule.description": { + details:this.noderule + }, "process.type": "batch", owner: this.owner, description: this.desc, @@ -447,22 +450,21 @@ export class PrComponent implements AfterViewChecked, OnInit { setTimeout(() => (this.visibleAnimate = true), 100); } - getRule(trans, otherinfo) { + getRule(trans) { var rule = ""; for (let i of trans) { rule = rule + i + ","; } rule = rule.substring(0, rule.lastIndexOf(",")); - this.pushRule(rule, otherinfo); + this.pushRule(rule); } - pushEnmRule(rule, grpname, originrule) { + pushEnmRule(rule, grpname) { var self = this; self.newMeasure["evaluate.rule"].rules.push({ "dsl.type": "griffin-dsl", "dq.type": "profiling", rule: rule, - description: originrule, name: grpname, details: { // "profiling": { @@ -473,13 +475,12 @@ export class PrComponent implements AfterViewChecked, OnInit { }); } - pushNullRule(rule, nullname, originrule) { + pushNullRule(rule, nullname) { var self = this; self.newMeasure["evaluate.rule"].rules.push({ "dsl.type": "griffin-dsl", "dq.type": "profiling", rule: rule, - description: originrule, name: nullname, details: { // "profiling": { @@ -490,13 +491,12 @@ export class PrComponent implements AfterViewChecked, OnInit { }); } - pushRule(rule, otherinfo) { + pushRule(rule) { var self = this; self.newMeasure["evaluate.rule"].rules.push({ "dsl.type": "griffin-dsl", "dq.type": "profiling", rule: rule, - description: otherinfo, name: "profiling", details: {} }); @@ -588,12 +588,12 @@ export class PrComponent implements AfterViewChecked, OnInit { enmvalue = this.transferRule(originrule, selected); grpname = selected.name + "-grp"; this.transenumrule.push(enmvalue); - this.pushEnmRule(enmvalue, grpname, originrule); + this.pushEnmRule(enmvalue, grpname); } else if (originrule == "Null Count") { nullvalue = this.transferRule(originrule, selected); nullname = selected.name + "-nullct"; this.transnullrule.push(nullvalue); - this.pushNullRule(nullvalue, nullname, originrule); + this.pushNullRule(nullvalue, nullname); } else { otherinfo = otherinfo + originrule + ","; value = this.transferRule(originrule, selected); @@ -608,8 +608,9 @@ export class PrComponent implements AfterViewChecked, OnInit { }); } if (this.transrule.length != 0) { - this.getRule(this.transrule, otherinfo); + this.getRule(this.transrule); } + this.ruledesc = JSON.stringify(this.noderule); } confirmAdd() { http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/measure/measure-detail/measure-detail.component.html ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/measure/measure-detail/measure-detail.component.html b/ui/angular/src/app/measure/measure-detail/measure-detail.component.html index a01f0ed..2980646 100644 --- a/ui/angular/src/app/measure/measure-detail/measure-detail.component.html +++ b/ui/angular/src/app/measure/measure-detail/measure-detail.component.html @@ -21,7 +21,7 @@ under the License. <h5 class="over-title margin-bottom-15">View Measure</h5> </div> <!--//row--> - <div class="row y-scrollable" style="max-height: 150px;"> + <div class="row y-scrollable" style="max-height: 300px;"> <div class="col-sm-6 col-xs-12"> <div id="viewruleDefinition" class="viewrule-content"> <div class="row"> @@ -176,7 +176,9 @@ under the License. </div> </div> <div *ngIf="ruleData.type=='profiling'" class=""> - <p>{{this.prorule}}</p> + <div *ngFor="let index of ruleDes;" > + {{index.name}} : {{index.infos}} + </div> </div> </div> </div> http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/measure/measure-detail/measure-detail.component.ts ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/measure/measure-detail/measure-detail.component.ts b/ui/angular/src/app/measure/measure-detail/measure-detail.component.ts index 7271296..42c41af 100644 --- a/ui/angular/src/app/measure/measure-detail/measure-detail.component.ts +++ b/ui/angular/src/app/measure/measure-detail/measure-detail.component.ts @@ -37,6 +37,7 @@ export class MeasureDetailComponent implements OnInit { public serviceService: ServiceService ) {} ruleData: any; + ruleDes = []; sourceLength: number; sourceDB: string; targetDB: string; @@ -52,7 +53,6 @@ export class MeasureDetailComponent implements OnInit { targetpath: string; type: string; currentrule: string; - prorule = ""; fetchData(value, index) { var data = this.ruleData["data.sources"][index].connectors[0]; @@ -85,18 +85,12 @@ export class MeasureDetailComponent implements OnInit { this.ruleData = data; if (this.ruleData["measure.type"] === "external") { this.ruleData.type = this.ruleData["measure.type"]; - } else { + } else{ this.ruleData.type = this.ruleData["dq.type"]; - var currentprorule = this.ruleData["evaluate.rule"].rules; - this.currentrule = currentprorule; - for (let index in currentprorule) { - this.prorule = - this.prorule + currentprorule[index].description + ","; + this.currentrule = this.ruleData["evaluate.rule"].rules; + if(this.ruleData["rule.description"]){ + this.ruleDes = this.ruleData["rule.description"].details } - this.prorule = this.prorule.substring( - 0, - this.prorule.lastIndexOf(",") - ); this.fetchData("source", 0); if (this.ruleData.type === "accuracy") { this.fetchData("target", 1); http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/metric/detail-metric/detail-metric.component.css ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/metric/detail-metric/detail-metric.component.css b/ui/angular/src/app/metric/detail-metric/detail-metric.component.css index 214f8c6..8515a16 100644 --- a/ui/angular/src/app/metric/detail-metric/detail-metric.component.css +++ b/ui/angular/src/app/metric/detail-metric/detail-metric.component.css @@ -15,4 +15,88 @@ software distributed under the License is distributed on an KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. -*/ \ No newline at end of file +*/ + +.table-scroll { + position:relative; + /*max-width:800px;*/ + margin:auto; + overflow:hidden; + /*border:1px solid #f5f5f5;*/ +} +.table-wrap { + /*width:100%;*/ + overflow:auto; +} +.table-scroll table { + /*width:100%;*/ + margin:auto; + border-collapse:separate; + border-spacing:0; +} +.table-scroll th, .table-scroll td { + padding:5px 10px; + border:1px solid #000; + /*background:#fff;*/ + white-space:nowrap; + vertical-align:top; +} +.table-scroll thead, .table-scroll tfoot { + /*background:#f9f9f9;*/ +} + +.main-table>tbody>tr:nth-of-type(even) { + background-color: #1f1f1f; +} + +.main-table>tbody>tr:nth-of-type(odd) { + background-color: #080808; +} + +.clone { + /*position:absolute;*/ + top:0; + left:0; + /*pointer-events:none;*/ +} +.clone th, .clone td { + /*visibility:hidden*/ +} +.clone td, .clone th { + border-color:transparent +} +.clone tbody th { + visibility:visible; + color:#fff; +} +.clone .fixed-side { + position:absolute; + /*border:1px solid #000;*/ + /*background:#1f1f1f;*/ + visibility:visible; + width: 150px; +} + +.clone tbody tr:nth-of-type(even) .fixed-side { + background: #1f1f1f; +} +.clone tbody tr:nth-of-type(odd) .fixed-side { + background: #080808; +} + +.cover { + position: static; + width: 150px; +} + +.title { + margin-top: 10px; + margin-bottom: 10px; + margin-left: 50%; + font-size: 18px; +} + +mfBootstrapPaginator { + position: fixed; +} +.clone thead, .clone tfoot{background:transparent;} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/metric/detail-metric/detail-metric.component.html ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/metric/detail-metric/detail-metric.component.html b/ui/angular/src/app/metric/detail-metric/detail-metric.component.html index 0359ac9..b3ea7fb 100644 --- a/ui/angular/src/app/metric/detail-metric/detail-metric.component.html +++ b/ui/angular/src/app/metric/detail-metric/detail-metric.component.html @@ -25,3 +25,58 @@ under the License. </div> </div> </div> +<div *ngIf="profiling" id="table-scroll" class="table-scroll"> + <div class="title"> + <b>{{this.prodata[0].name}}</b> + </div> + <div class="table-wrap"> + <table class="main-table y-scrollable" [mfData]="prodata" #mf="mfDataTable" [mfRowsOnPage]="18"> + <thead> + <tr style="background-color:#7D95CC"> + <th class="fixed-side" scope="col" style="background-color:#7D95CC">Time</th> + <th class="cover" scope="col">Time</th> + <th scope="col" *ngFor="let name of this.columnname">{{name}}</th> + </tr> + </thead> + <tbody> + <tr *ngFor="let item of mf.data"> + <th class="fixed-side">{{(item.tmst | date: 'yyyy/MM/dd HH:mm:ss') || 'N/A' }}</th> + <th class="cover">{{(item.tmst | date: 'yyyy/MM/dd HH:mm:ss') || 'N/A' }}</th> + <td *ngFor="let key of objectKeys(item.value)">{{item.value[key]}}</td> + </tr> + </tbody> + <tfoot> + <tr> + <td class="text-center" colspan="8" style="background-color:#1f1f1f;" id="pagination"> + <mfBootstrapPaginator></mfBootstrapPaginator> + </td> + </tr> + </tfoot> + </table> + </div> +</div> +<!-- <div *ngIf="profiling" id="table-scroll" class="table-scroll"> + <div class="table-wrap"> + <table class="main-table" #mf="mfDataTable" [mfData]="this.data" [mfRowsOnPage]="20"> + <thead> + <tr style="background-color:#7D95CC"> + <th class="fixed-side" scope="col">Time</th> + <th scope="col" *ngFor="let name of this.columnname">{{name}}</th> + </tr> + </thead> + <tbody> + <tr *ngFor="let item of mf.data"> + <th class="fixed-side">{{(item.tmst | date: 'yyyy/MM/dd HH:mm:ss') || 'N/A' }}</th> + <td *ngFor="let key of objectKeys(item.value)">{{item.value[key]}}</td> + </tr> + </tbody> + <tfoot> + <tr> + <td class="text-center" colspan="8" style="background-color:#1f1f1f;" id="pagination"> + <mfBootstrapPaginator></mfBootstrapPaginator> + </td> + </tr> + </tfoot> + </table> + </div> +</div> --> http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/metric/detail-metric/detail-metric.component.ts ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/metric/detail-metric/detail-metric.component.ts b/ui/angular/src/app/metric/detail-metric/detail-metric.component.ts index 953226e..5aaf380 100644 --- a/ui/angular/src/app/metric/detail-metric/detail-metric.component.ts +++ b/ui/angular/src/app/metric/detail-metric/detail-metric.component.ts @@ -16,13 +16,14 @@ KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. */ -import { Component, OnInit, OnChanges, SimpleChanges, OnDestroy, AfterViewInit, NgZone } from "@angular/core"; +import { Component, OnInit, OnChanges, SimpleChanges, OnDestroy, AfterViewInit, AfterViewChecked, NgZone } from "@angular/core"; import { ChartService } from "../../service/chart.service"; import { ServiceService } from "../../service/service.service"; import { Router, ActivatedRoute, ParamMap } from "@angular/router"; import "rxjs/add/operator/switchMap"; import { HttpClient } from "@angular/common/http"; import * as $ from "jquery"; +import { DataTableModule } from "angular2-datatable"; @Component({ selector: "app-detail-metric", @@ -30,7 +31,8 @@ import * as $ from "jquery"; styleUrls: ["./detail-metric.component.css"], providers: [ChartService, ServiceService] }) -export class DetailMetricComponent implements OnInit { +export class DetailMetricComponent implements AfterViewChecked, OnInit { + objectKeys = Object.keys; constructor( public chartService: ChartService, private route: ActivatedRoute, @@ -44,9 +46,12 @@ export class DetailMetricComponent implements OnInit { data: any; currentJob: string; finalData: any; + prodata = []; metricName: string; size = 300; offset = 0; + profiling = false; + columnname = []; ngOnInit() { this.currentJob = this.route.snapshot.paramMap.get("name"); @@ -62,31 +67,42 @@ export class DetailMetricComponent implements OnInit { this.offset; this.http.get(metricDetailUrl).subscribe( data => { - var metric = { - name: "", - timestamp: 0, - dq: 0, - details: [] - }; this.data = data; - if (this.data) { + if(this.data && this.data[0].value.matched != undefined){ + var metric = { + name: "", + timestamp: 0, + dq: 0, + details: [] + }; metric.name = this.data[0].name; metric.timestamp = this.data[0].tmst; metric.dq = this.data[0].value.matched / this.data[0].value.total * 100; - metric.details = JSON.parse(JSON.stringify(this.data)); + metric.details = JSON.parse(JSON.stringify(this.data)); + this.chartOption = this.chartService.getOptionBig(metric); + $("#bigChartDiv").height(window.innerHeight - 120 + "px"); + $("#bigChartDiv").width(window.innerWidth - 400 + "px"); + $("#bigChartContainer").show(); + }else{ + this.prodata = this.data; + this.profiling = true; + for(let key in this.data[0].value){ + this.columnname.push(key); + } + for(let item of this.data){ + for(let key in item.value){ + item.value[key].toString(); + } + } } - this.chartOption = this.chartService.getOptionBig(metric); - $("#bigChartDiv").height(window.innerHeight - 120 + "px"); - $("#bigChartDiv").width(window.innerWidth - 400 + "px"); - $("#bigChartContainer").show(); }, err => { console.log("Error occurs when connect to elasticsearh!"); } ); } - + onResize(event) { this.resizeTreeMap(); } @@ -97,4 +113,8 @@ export class DetailMetricComponent implements OnInit { } getData(metricName) {} + + ngAfterViewChecked() { + $(".main-table").addClass('clone'); + } } \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/metric/metric.component.ts ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/metric/metric.component.ts b/ui/angular/src/app/metric/metric.component.ts index dba4d06..179c58f 100644 --- a/ui/angular/src/app/metric/metric.component.ts +++ b/ui/angular/src/app/metric/metric.component.ts @@ -67,25 +67,46 @@ export class MetricComponent implements OnInit { var metricData = this.mesWithJob[mesName][0]; if ( metricData.metricValues[0] != undefined && - metricData.metricValues[0].value.matched != undefined + metricData.type == 'accuracy' ) { for(let i=0;i<jobs.length;i++){ - var metricNode = { - name: "", - timestamp: "", - dq: 0, - details: [] - }; - metricNode.details = JSON.parse( - JSON.stringify(jobs[i].metricValues) - ); - metricNode.name = jobs[i].name; - metricNode.timestamp = jobs[i].metricValues[0].value.tmst; - metricNode.dq = - jobs[i].metricValues[0].value.matched / - jobs[i].metricValues[0].value.total * - 100; - node.metrics.push(metricNode); + if(jobs[i].metricValues.length != 0){ + var metricNode = { + name: "", + timestamp: "", + dq: 0, + details: [] + }; + metricNode.details = JSON.parse( + JSON.stringify(jobs[i].metricValues) + ); + metricNode.name = jobs[i].name; + metricNode.timestamp = jobs[i].metricValues[0].value.tmst; + metricNode.dq = + jobs[i].metricValues[0].value.matched / + jobs[i].metricValues[0].value.total * + 100; + node.metrics.push(metricNode); + } + } + }else if(metricData.metricValues[0] != undefined && + metricData.type == 'profiling'){ + for(let i=0;i<jobs.length;i++){ + if(jobs[i].metricValues.length != 0){ + var metricNode = { + name: "", + timestamp: "", + dq: 0, + details: [] + }; + metricNode.details = JSON.parse( + JSON.stringify(jobs[i].metricValues) + ); + metricNode.name = jobs[i].name; + metricNode.timestamp = jobs[i].metricValues[0].value.tmst; + metricNode.dq = 0; + node.metrics.push(metricNode); + } } } this.finalData.push(node); @@ -115,7 +136,7 @@ export class MetricComponent implements OnInit { divs.get(0).style.height = this.chartHeight; this.chartOption.set( chartId, - this.chartService.getOptionThum(data[i].metrics[j]) + this.chartService.getOptionThum(data[i].metrics[j],chartId) ); } } http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/service/chart.service.ts ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/service/chart.service.ts b/ui/angular/src/app/service/chart.service.ts index bdf6530..9f13813 100644 --- a/ui/angular/src/app/service/chart.service.ts +++ b/ui/angular/src/app/service/chart.service.ts @@ -186,8 +186,16 @@ export class ChartService { return series; } - getOptionThum(metric) { + getOptionThum(metric,chartId) { var data = this.getMetricData(metric); + if(isNaN(data[0][1])){ + let _chartId = "#" + chartId; + var divs = $(_chartId); + var i = document.createElement('i'); + var code = "<div><div style='margin-left:30%'>"+metric.name+ + "</div><div style='margin-left:20%'>Click to see details</div><img src='/assets/img/table.png' style='margin-top:30px;margin-left:30%'/></div>"; + $(divs).html(code); + }else{ var self = this; var option = { title: { @@ -262,6 +270,7 @@ export class ChartService { }; option.series = this.getSeries(metric); return option; + } } getOptionBig(metric) { http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/app/sidebar/sidebar.component.ts ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/sidebar/sidebar.component.ts b/ui/angular/src/app/sidebar/sidebar.component.ts index e8418b2..f0c623e 100644 --- a/ui/angular/src/app/sidebar/sidebar.component.ts +++ b/ui/angular/src/app/sidebar/sidebar.component.ts @@ -118,22 +118,24 @@ export class SidebarComponent implements OnInit { metricData.metricValues[0].value.matched != undefined ) { for(let i=0;i<jobs.length;i++){ - var metricNode = { - name: "", - timestamp: "", - dq: 0, - details: [] - }; - metricNode.details = JSON.parse( - JSON.stringify(jobs[i].metricValues) - ); - metricNode.name = jobs[i].name; - metricNode.timestamp = jobs[i].metricValues[0].value.tmst; - metricNode.dq = - jobs[i].metricValues[0].value.matched / - jobs[i].metricValues[0].value.total * - 100; - node.metrics.push(metricNode); + if(jobs[i].metricValues.length != 0){ + var metricNode = { + name: "", + timestamp: "", + dq: 0, + details: [] + }; + metricNode.details = JSON.parse( + JSON.stringify(jobs[i].metricValues) + ); + metricNode.name = jobs[i].name; + metricNode.timestamp = jobs[i].metricValues[0].value.tmst; + metricNode.dq = + jobs[i].metricValues[0].value.matched / + jobs[i].metricValues[0].value.total * + 100; + node.metrics.push(metricNode); + } } } this.finalData.push(node); http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/459c9665/ui/angular/src/assets/img/table.png ---------------------------------------------------------------------- diff --git a/ui/angular/src/assets/img/table.png b/ui/angular/src/assets/img/table.png new file mode 100644 index 0000000..d0b7f32 Binary files /dev/null and b/ui/angular/src/assets/img/table.png differ
