Repository: incubator-griffin Updated Branches: refs/heads/master fe281f258 -> 6a309cd08
http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/6a309cd0/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 e0924cb..73ba71b 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 @@ -34,7 +34,7 @@ import * as $ from 'jquery'; export class DetailMetricComponent implements OnInit { constructor(public chartService:ChartService,private route: ActivatedRoute, - private router: Router,private http:HttpClient,private zone:NgZone,public servicecService:ServiceService + private router: Router,private http:HttpClient,private zone:NgZone,public serviceService:ServiceService ) { // var self = this; // setTimeout(function () { @@ -50,179 +50,38 @@ export class DetailMetricComponent implements OnInit { data:any; currentMeasure:string; finalData:any; -// metricData = { -// "hits" : { -// "hits" : [ -// { -// "_source" : { -// "name" : "xixi", -// "tmst" : 1493962623461, -// "total" : 8043288, -// "matched" : 8034775 -// } -// }, -// { -// "_source" : { -// "name" : "xixi", -// "tmst" : 1493973423461, -// "total" : 9479698, -// "matched" : 9476094 -// } -// }, -// { -// "_source" : { -// "name" : "xixi", -// "tmst" : 1493987823461, -// "total" : 9194117, -// "matched" : 9164237 -// } -// }, -// { -// "_source" : { -// "name" : "xixi", -// "tmst" : 1493995023461, -// "total" : 9429018, -// "matched" : 9375324 -// } -// }, -// { -// "_source" : { -// "name" : "haha", -// "tmst" : 1493959023461, -// "total" : 1086389, -// "matched" : 1083336 -// } -// }, -// { -// "_source" : { -// "name" : "haha", -// "tmst" : 1493973423461, -// "total" : 1090650, -// "matched" : 1090445 -// } -// }, -// { -// "_source" : { -// "name" : "xixi", -// "tmst" : 1494009423461, -// "total" : 8029660, -// "matched" : 7979653 -// } -// }, -// { -// "_source" : { -// "name" : "haha", -// "tmst" : 1493980623461, -// "total" : 1088940, -// "matched" : 1079003 -// } -// }, -// { -// "_source" : { -// "name" : "haha", -// "tmst" : 1493995023461, -// "total" : 1048833, -// "matched" : 1047890 -// } -// }, -// { -// "_source" : { -// "name" : "search_hourly", -// "tmst" : 1493948223461, -// "total" : 100, -// "matched" : 99 -// } -// }, -// { -// "_source" : { -// "name" : "hh", -// "tmst" : 1493948224461, -// "total" : 100, -// "matched" : 99 -// } -// }, -// { -// "_source" : { -// "name" : "search_hourly", -// "tmst" : 1493948225461, -// "total" : 100, -// "matched" : 99 -// } -// }, -// { -// "_source" : { -// "name" : "hh", -// "tmst" : 1493948226461, -// "total" : 100, -// "matched" : 99 -// } -// }, -// { -// "_source" : { -// "name" : "buy_hourly", -// "tmst" : 1493948223461, -// "total" : 100, -// "matched" : 99 -// } -// }, -// { -// "_source" : { -// "name" : "hh", -// "tmst" : 1493948224461, -// "total" : 100, -// "matched" : 99 -// } -// }, -// { -// "_source" : { -// "name" : "buy_hourly", -// "tmst" : 1493948225461, -// "total" : 100, -// "matched" : 99 -// } -// }, -// { -// "_source" : { -// "name" : "buy_hourly", -// "tmst" : 1493948226461, -// "total" : 100, -// "matched" : 99 -// } -// } -// ] -// } -// } -// ; ngOnInit() { console.log('init'); this.currentMeasure = this.route.snapshot.paramMap.get('name'); // this.finalData = this.getData(this.currentMeasure); var self = this; - // let url_dashboard = this.servicecService.config.uri.dashboard; - var metricDetailUrl = this.servicecService.config.uri.dashboard; + // let url_dashboard = this.serviceService.config.uri.dashboard; + var metricDetailUrl = this.serviceService.config.uri.dashboard; // let data = this.metricData; - this.http.post(metricDetailUrl, {"query": { "bool":{"filter":[ {"term" : {"name": this.currentMeasure }}]}}, "sort": [{"tmst": {"order": "asc"}}],"size":1000}).subscribe( data=> { - var metric = { + this.http.post(metricDetailUrl, {"query": { "bool":{"filter":[ {"term" : {"name.keyword": this.currentMeasure }}]}}, "sort": [{"tmst": {"order": "asc"}}],"size":1000}).subscribe( data=> { + var metric = { 'name':'', 'timestamp':0, 'dq':0, 'details':[] }; - this.data = data; - metric.name = this.data.hits.hits[0]._source.name; - metric.timestamp =this.data.hits.hits[this.data.hits.hits.length-1]._source.tmst; - metric.dq = this.data.hits.hits[this.data.hits.hits.length-1]._source.matched/this.data.hits.hits[this.data.hits.hits.length-1]._source.matched*100; - metric.details = new Array(); - for(let point of this.data.hits.hits){ - metric.details.push(point); - }; - this.chartOption = this.chartService.getOptionBig(metric); - $('#bigChartDiv').height(window.innerHeight-120+'px'); + this.data = data; + console.log(this.data); + // this.data = this.allData; + metric.name = this.data.hits.hits[0]._source.name; + metric.timestamp =this.data.hits.hits[this.data.hits.hits.length-1]._source.tmst; + metric.dq = this.data.hits.hits[this.data.hits.hits.length-1]._source.value.matched/this.data.hits.hits[this.data.hits.hits.length-1]._source.value.matched*100; + metric.details = new Array(); + for(let point of this.data.hits.hits){ + metric.details.push(point); + }; + this.chartOption = this.chartService.getOptionBig(metric); + $('#bigChartDiv').height(window.innerHeight-120+'px'); $('#bigChartDiv').width(window.innerWidth-400+'px'); $('#bigChartContainer').show(); // return metric; - }); + }); // setTimeout(function function_name(argument) { // // body... http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/6a309cd0/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 16cc750..96d9ba2 100644 --- a/ui/angular/src/app/metric/metric.component.ts +++ b/ui/angular/src/app/metric/metric.component.ts @@ -35,7 +35,7 @@ export class MetricComponent implements OnInit { constructor( public chartService:ChartService, // public getMetricService:GetMetricService, - public servicecService:ServiceService, + public serviceService:ServiceService, private http: HttpClient, private router:Router) { } orgs = []; @@ -61,93 +61,8 @@ export class MetricComponent implements OnInit { selectedOrgIndex = 0; // var formatUtil = echarts.format; metricData = []; - - // metricData = { - // "hits" : { - // "hits" : [ - // { - // "_source" : { - // "name" : "xixi", - // "tmst" : 1493962623461, - // "total" : 8043288, - // "matched" : 8034775 - // } - // }, - // { - // "_source" : { - // "name" : "xixi", - // "tmst" : 1493973423461, - // "total" : 9479698, - // "matched" : 9476094 - // } - // }, - // { - // "_source" : { - // "name" : "xixi", - // "tmst" : 1493987823461, - // "total" : 9194117, - // "matched" : 9164237 - // } - // }, - // { - // "_source" : { - // "name" : "xixi", - // "tmst" : 1493995023461, - // "total" : 9429018, - // "matched" : 9375324 - // } - // }, - // { - // "_source" : { - // "name" : "xixi", - // "tmst" : 1494009423461, - // "total" : 8029660, - // "matched" : 7979653 - // } - // }, - // { - // "_source" : { - // "name" : "haha", - // "tmst" : 1493959023461, - // "total" : 1086389, - // "matched" : 1083336 - // } - // }, - // { - // "_source" : { - // "name" : "haha", - // "tmst" : 1493973423461, - // "total" : 1090650, - // "matched" : 1090445 - // } - // }, - // { - // "_source" : { - // "name" : "haha", - // "tmst" : 1493980623461, - // "total" : 1088940, - // "matched" : 1079003 - // } - // }, - // { - // "_source" : { - // "name" : "haha", - // "tmst" : 1493995023461, - // "total" : 1048833, - // "matched" : 1047890 - // } - // }, - // { - // "_source" : { - // "name" : "haha", - // "tmst" : 1494013023461, - // "total" : 1063349, - // "matched" : 1055783 - // } - // } - // ] - // } - // }; + orgWithMeasure:any; + public duplicateArray() { let arr = []; @@ -180,23 +95,38 @@ export class MetricComponent implements OnInit { renderData(){ - var url_organization = this.servicecService.config.uri.organization; + var url_organization = this.serviceService.config.uri.organization; this.http.get(url_organization).subscribe(data => { - let orgWithMeasure = data; + this.orgWithMeasure = data; var orgNode = null; - for(let orgName in orgWithMeasure){ + for(let orgName in this.orgWithMeasure){ orgNode = new Object(); orgNode.name = orgName; - orgNode.measureMap = orgWithMeasure[orgName]; + orgNode.jobMap = []; + orgNode.measureMap = []; + for(let key in this.orgWithMeasure[orgName]){ + orgNode.measureMap.push(key); + this.measureOptions.push(key); + // console.log(this.measureOptions); + if(this.orgWithMeasure[orgName][key]!=null){ + for(let i = 0;i < this.orgWithMeasure[orgName][key].length;i++){ + orgNode.jobMap.push(this.orgWithMeasure[orgName][key][i].jobName); + } + } + } this.orgs.push(orgNode); } this.originalOrgs = this.orgs; - let url_dashboard = this.servicecService.config.uri.dashboard; + // console.log(this.originalOrgs); + let url_dashboard = this.serviceService.config.uri.dashboard; this.http.post(url_dashboard, {"query": {"match_all":{}}, "sort": [{"tmst": {"order": "asc"}}],"size":1000}).subscribe(data => { - // this.originalData = JSON.parse(JSON.stringify(data)); this.originalData = data; this.myData = JSON.parse(JSON.stringify(this.originalData.hits.hits)); + // this.myData = this.allData.hits.hits; this.metricName = []; + // for(var i = 0;i<this.myData.length;i++){ + // this.metricName.push(this.myData[i]._source.name); + // } for(var i = 0;i<this.myData.length;i++){ this.metricName.push(this.myData[i]._source.name); } @@ -221,7 +151,7 @@ export class MetricComponent implements OnInit { node.dq = 0; node.metrics = new Array(); for (let metric of this.metricData){ - if(sys.measureMap.indexOf(metric[metric.length-1]._source.name)!= -1){ + if(sys.jobMap.indexOf(metric[metric.length-1]._source.name)!= -1){ var metricNode = { 'name':'', 'timestamp':'', @@ -230,7 +160,7 @@ export class MetricComponent implements OnInit { } metricNode.name = metric[metric.length-1]._source.name; metricNode.timestamp = metric[metric.length-1]._source.tmst; - metricNode.dq = metric[metric.length-1]._source.matched/metric[metric.length-1]._source.total*100; + metricNode.dq = metric[metric.length-1]._source.value.matched/metric[metric.length-1]._source.value.total*100; metricNode.details = metric; node.metrics.push(metricNode); } @@ -244,7 +174,7 @@ export class MetricComponent implements OnInit { self.redraw(self.finalData); },0) - console.log(this.finalData); + // console.log(this.finalData); // return JSON.parse(JSON.stringify(this.finalData)); return this.finalData; }); @@ -303,12 +233,21 @@ export class MetricComponent implements OnInit { } else { var org = this.originalData[this.selectedOrgIndex-1]; - this.finalData.push(org); - for(let metric of org.metrics){ - if(this.measureOptions.indexOf(metric.name) == -1){ - this.measureOptions.push(metric.name); - } + for(let key in this.orgWithMeasure){ + if(key == org.name){ + for(let measure in this.orgWithMeasure[key]){ + this.measureOptions.push(measure); + } + } } + this.finalData.push(org); + // console.log(this.finalData); + // for(let metric of org.metrics){ + // if(this.measureOptions.indexOf(metric.name) == -1){ + // this.measureOptions.push(metric.name); + // } + // } + } var self = this; // self.data = self.renderData(); @@ -316,39 +255,59 @@ export class MetricComponent implements OnInit { // self.redraw(self.finalData); self.redraw(self.finalData); }, 0); - console.log(this.originalData); + // console.log(this.originalData); }; changeMeasure() { this.finalData = []; + var jobdetail = []; if(this.selectedOrgIndex == 0){ for(let data of this.originalData){ this.finalData.push(data); } } else { - // var org = this.originalData[this.selectedOrgIndex-1]; - var org = JSON.parse(JSON.stringify(this.originalData[this.selectedOrgIndex-1])); + var org = JSON.parse(JSON.stringify(this.originalData[this.selectedOrgIndex-1])); this.finalData.push(org); - } + // } if(this.selectedMeasureIndex != undefined && this.selectedMeasureIndex != 0){ var measure = this.measureOptions[this.selectedMeasureIndex-1]; + for(let key in this.orgWithMeasure){ + if(key == org.name){ + for(let measurename in this.orgWithMeasure[key]){ + if(measurename == measure){ + // console.log(this.orgWithMeasure[key][measurename]); + for(let i=0;i< this.orgWithMeasure[key][measurename].length;i++){ + jobdetail.push(this.orgWithMeasure[key][measurename][i].jobName); + } + } + } + } + } for(let sys of this.finalData){ let oldMetrics = sys.metrics; sys.metrics = []; for(let i = 0;i<oldMetrics.length;i++){ - if(oldMetrics[i].name == measure) { + + // console.log(jobdetail); + for(let j=0;j< jobdetail.length;j++){ + console.log(oldMetrics[i].name); + console.log(jobdetail[j]); + if(oldMetrics[i].name == jobdetail[j]) { sys.metrics.push(oldMetrics[i]); } + } + }; }; } + } var self = this; // self.data = self.renderData(); setTimeout(function() { // self.redraw(self.finalData); self.redraw(self.finalData); }, 0); - console.log(this.originalData); + // console.log(this.originalData); } // function resizePieChart() { http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/6a309cd0/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 760dd9a..056b1eb 100644 --- a/ui/angular/src/app/service/chart.service.ts +++ b/ui/angular/src/app/service/chart.service.ts @@ -63,7 +63,7 @@ export class ChartService { var chartData = metric.details; for(var i = 0; i < chartData.length; i++){ if(chartData[i]._source.total!=0) - data.push([this.formatTimeStamp(chartData[i]._source.tmst), parseFloat((chartData[i]._source.matched/chartData[i]._source.total*100).toFixed(2))]); + data.push([this.formatTimeStamp(chartData[i]._source.tmst), parseFloat((chartData[i]._source.value.matched/chartData[i]._source.value.total*100).toFixed(2))]); else data.push([this.formatTimeStamp(chartData[i]._source.tmst), parseFloat((0).toFixed(2))]); } http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/6a309cd0/ui/angular/src/app/service/service.service.ts ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/service/service.service.ts b/ui/angular/src/app/service/service.service.ts index cb95212..301be49 100644 --- a/ui/angular/src/app/service/service.service.ts +++ b/ui/angular/src/app/service/service.service.ts @@ -22,12 +22,13 @@ import { Injectable } from '@angular/core'; export class ServiceService { constructor() { } - // public this.BACKEND_SERVER = 'http://10.149.247.156:38080'; - //public BACKEND_SERVER = 'http://localhost:8080'; + // public this.BACKEND_SERVER = 'http://10.65.145.88:38080'; + // public BACKEND_SERVER = 'http://localhost:8080'; public BACKEND_SERVER = ''; public API_ROOT_PATH = '/api/v1'; public ES_SERVER = "http://"; + location.host.replace("8080", "9200"); //public ES_SERVER = "http://10.64.222.80:39200"; ; + // public ES_SERVER = "http://10.65.145.88:39200"; ; public config = { // URI paths, always have a trailing / @@ -35,9 +36,9 @@ export class ServiceService { base: this.BACKEND_SERVER + this.API_ROOT_PATH, login:this.BACKEND_SERVER + this.API_ROOT_PATH+ '/login/authenticate', - dbtree:this.BACKEND_SERVER + this.API_ROOT_PATH+ '/metadata/hive/allTables', - schemadefinition: this.BACKEND_SERVER + this.API_ROOT_PATH+ '/metadata/hive/table', - dataassetlist: this.BACKEND_SERVER + this.API_ROOT_PATH + '/metadata/hive/allTables', + dbtree:this.BACKEND_SERVER + this.API_ROOT_PATH+ '/metadata/hive/dbs/tables', + //schemadefinition: this.BACKEND_SERVER + this.API_ROOT_PATH+ '/metadata/hive/table', + dataassetlist: this.BACKEND_SERVER + this.API_ROOT_PATH + '/metadata/hive/dbs/tables', // adddataasset: this.BACKEND_SERVER + this.API_ROOT_PATH + '/dataassets', // updatedataasset: this.BACKEND_SERVER + this.API_ROOT_PATH + '/dataassets', @@ -70,7 +71,7 @@ export class ServiceService { // dashboard:'/dashboard.json', - organization:this.BACKEND_SERVER + this.API_ROOT_PATH + '/orgWithMetricsName', + organization:this.BACKEND_SERVER + this.API_ROOT_PATH + '/org/measure/jobs', dashboard:this.ES_SERVER+'/griffin/accuracy/_search?pretty&filter_path=hits.hits._source', @@ -86,7 +87,7 @@ export class ServiceService { enableModel: this.BACKEND_SERVER + this.API_ROOT_PATH + '/models/enableModel', //Jobs - allJobs:this.BACKEND_SERVER + this.API_ROOT_PATH + '/jobs/', + allJobs:this.BACKEND_SERVER + this.API_ROOT_PATH + '/jobs', addJobs:this.BACKEND_SERVER + this.API_ROOT_PATH + '/jobs', getMeasuresByOwner:this.BACKEND_SERVER + this.API_ROOT_PATH +'/measures/owner/', deleteJob:this.BACKEND_SERVER + this.API_ROOT_PATH + '/jobs', http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/6a309cd0/ui/angular/src/app/sidebar/sidebar.component.html ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/sidebar/sidebar.component.html b/ui/angular/src/app/sidebar/sidebar.component.html index deeb94f..f3bcb5e 100644 --- a/ui/angular/src/app/sidebar/sidebar.component.html +++ b/ui/angular/src/app/sidebar/sidebar.component.html @@ -64,7 +64,7 @@ under the License. <i class="fa fa-line-chart faArrows"></i> <span class="side-date">{{items.timestamp | date:'short' }}</span> - <span class="side-name" title="{{items.name}}">{{items.name }}</span> + <span class="side-name" title="{{items.name}}">{{items.name |truncate :10}}</span> <!-- <span ng-if="items.dq <= 100" class="pull-right" [ngClass]="items.dqfail?'side-percent-red':'side-percent'">{{items.dq}}%</span> --> <!-- <span ng-if="items.dq > 100" class="pull-right" [ngClass]="items.dqfail?'side-percent-red':''">{{items.dq/1000}}K</span> --> </a> http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/6a309cd0/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 b0c2211..140c981 100644 --- a/ui/angular/src/app/sidebar/sidebar.component.ts +++ b/ui/angular/src/app/sidebar/sidebar.component.ts @@ -22,6 +22,7 @@ import {Router} from "@angular/router"; import {ChartService} from '../service/chart.service'; import {DatePipe} from '@angular/common'; import {ServiceService} from '../service/service.service'; +import {TruncatePipe} from './truncate.pipe'; // import {GetMetricService} from '../service/get-metric.service'; import * as $ from 'jquery'; @@ -29,13 +30,14 @@ import * as $ from 'jquery'; selector: 'app-sidebar', templateUrl: './sidebar.component.html', styleUrls: ['./sidebar.component.css'], + // pipes: [TruncatePipe], providers:[ChartService,ServiceService] }) export class SidebarComponent implements OnInit { constructor(private http: HttpClient, private router:Router, - public servicecService:ServiceService, + public serviceService:ServiceService, public chartService:ChartService) { } @@ -52,11 +54,13 @@ export class SidebarComponent implements OnInit { metricNameUnique = []; myData = []; chartOption = new Map(); + orgWithMeasure:any; + measureOptions = []; // var formatUtil = echarts.format; pageInit() { - // var allDataassets = this.servicecService.config.uri.dataassetlist; - var health_url = this.servicecService.config.uri.statistics; + // var allDataassets = this.serviceService.config.uri.dataassetlist; + var health_url = this.serviceService.config.uri.statistics; this.http.get(health_url).subscribe(data => { // this.status.health = data.healthyJobCount; // this.status.invalid = data.jobCount - data.healthyJobCount; @@ -107,23 +111,38 @@ export class SidebarComponent implements OnInit { sideBarList(sysName){ // this.finalData = this.getMetricService.renderData(); - var url_organization = this.servicecService.config.uri.organization; - this.http.get(url_organization).subscribe(data => { - let orgWithMeasure = data; + var url_organization = this.serviceService.config.uri.organization; + this.http.get(url_organization).subscribe(data => { + this.orgWithMeasure = data; var orgNode = null; - for(let orgName in orgWithMeasure){ + for(let orgName in this.orgWithMeasure){ orgNode = new Object(); orgNode.name = orgName; - orgNode.measureMap = orgWithMeasure[orgName]; + orgNode.jobMap = []; + orgNode.measureMap = []; + for(let key in this.orgWithMeasure[orgName]){ + orgNode.measureMap.push(key); + this.measureOptions.push(key); + // console.log(this.measureOptions); + if(this.orgWithMeasure[orgName][key]!=null){ + for(let i = 0;i < this.orgWithMeasure[orgName][key].length;i++){ + orgNode.jobMap.push(this.orgWithMeasure[orgName][key][i].jobName); + } + } + } this.orgs.push(orgNode); } this.originalOrgs = this.orgs; - let url_dashboard = this.servicecService.config.uri.dashboard; + // console.log(this.originalOrgs); + let url_dashboard = this.serviceService.config.uri.dashboard; this.http.post(url_dashboard, {"query": {"match_all":{}}, "sort": [{"tmst": {"order": "asc"}}],"size":1000}).subscribe(data => { - // this.originalData = JSON.parse(JSON.stringify(data)); this.originalData = data; this.myData = JSON.parse(JSON.stringify(this.originalData.hits.hits)); + // this.myData = this.allData.hits.hits; this.metricName = []; + // for(var i = 0;i<this.myData.length;i++){ + // this.metricName.push(this.myData[i]._source.name); + // } for(var i = 0;i<this.myData.length;i++){ this.metricName.push(this.myData[i]._source.name); } @@ -148,7 +167,7 @@ export class SidebarComponent implements OnInit { node.dq = 0; node.metrics = new Array(); for (let metric of this.metricData){ - if(sys.measureMap.indexOf(metric[metric.length-1]._source.name)!= -1){ + if(sys.jobMap.indexOf(metric[metric.length-1]._source.name)!= -1){ var metricNode = { 'name':'', 'timestamp':'', @@ -157,14 +176,15 @@ export class SidebarComponent implements OnInit { } metricNode.name = metric[metric.length-1]._source.name; metricNode.timestamp = metric[metric.length-1]._source.tmst; - metricNode.dq = metric[metric.length-1]._source.matched/metric[metric.length-1]._source.total*100; + metricNode.dq = metric[metric.length-1]._source.value.matched/metric[metric.length-1]._source.value.total*100; metricNode.details = metric; node.metrics.push(metricNode); } } this.finalData.push(node); } - console.log(this.finalData); + this.originalData = JSON.parse(JSON.stringify(this.finalData)); + // console.log(this.finalData); // return JSON.parse(JSON.stringify(this.finalData)); return this.finalData; }); http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/6a309cd0/ui/angular/src/app/sidebar/truncate.pipe.ts ---------------------------------------------------------------------- diff --git a/ui/angular/src/app/sidebar/truncate.pipe.ts b/ui/angular/src/app/sidebar/truncate.pipe.ts new file mode 100644 index 0000000..6c5558a --- /dev/null +++ b/ui/angular/src/app/sidebar/truncate.pipe.ts @@ -0,0 +1,31 @@ +/* +Licensed to the Apache Software Foundation (ASF) under one +or more contributor license agreements. See the NOTICE file +distributed with this work for additional information +regarding copyright ownership. The ASF licenses this file +to you under the Apache License, Version 2.0 (the +"License"); you may not use this file except in compliance +with the License. You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, +software distributed under the License is distributed on an +"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +KIND, either express or implied. See the License for the +specific language governing permissions and limitations +under the License. +*/ +import {Pipe, PipeTransform} from '@angular/core' + +@Pipe({ + name: 'truncate' +}) +export class TruncatePipe { + transform(value: string, limit: number) : string { + + let trail = '...'; + + return value.length > limit ? value.substring(0, limit) + trail : value; + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/incubator-griffin/blob/6a309cd0/ui/angular/src/styles.css ---------------------------------------------------------------------- diff --git a/ui/angular/src/styles.css b/ui/angular/src/styles.css index 6e85b67..e6b90ab 100644 --- a/ui/angular/src/styles.css +++ b/ui/angular/src/styles.css @@ -1131,4 +1131,36 @@ tbody { top:0; left:0; z-index:1; -} \ No newline at end of file +} + +.selected-list .c-list .c-token{ + margin-top: 4px; +} + +.myclass * .c-token{ + background: #518dab !important; +} + +.myclass * div.selected-list .c-btn , .myclass * ul , .list-filter input{ + background: #dcdad6; +} + +.myclass * div.arrow-up{ + border-bottom: 15px solid #dcdad6; +} + +.myclass * div .list-grp h4{ + color: #518dab; +} + +input{ + color: #888; +} + +.table > tbody > tr > td,.table > thead > tr > th{ + border: 1px solid transparent; + } + + .toggle-children{ + background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAASCAYAAABSO15qAAAApUlEQVQ4T8XULQ7CQBCG4fcTWBJuVodEcAEEBtcbcAU0Bq7ATQgKi0PQTAOhzdD0b7aC9fPs7O43K+AEbIArCUtmZpLepRdgFYU+QLXxFzoD2dhmfgAHFcABWA9BrUAE6gUa0BbYNzsaBTjoAeQeCgFtUBLgoPt/AEn1XYQ68IX1MXwSu0Ij6Qnsws8ozQp49SayI8oLg/kRbstQlJOHadI4T/1QSjKSYdGc5u4/AAAAAElFTkSuQmCC') !important; + } \ No newline at end of file
