Skip to content

A
atlas
Commit 21b403bb by Anilsg Committed by Suma Shivaprasad
Options

ATLAS-287: UI: GUID on table details page

Signed-off-by: 's avatarSuma Shivaprasad <sumasai.shivaprasad@gmail.com>
parent bd47628f
Showing with 201 additions and 126 deletions
dashboard/public/modules/details/detailsController.js
......@@ -23,16 +23,49 @@ angular.module('dgc.details').controller('DetailsController', ['$window', '$scop
$scope.tableName = false;
$scope.isTable = false;
$scope.isLineage = false;
DetailsResource.get({
id: $stateParams.id
}, function(data) {
$scope.details = data;
$scope.tableName = data.values.name;
$scope.onActivate('io');
$scope.isTags = (typeof data.traits !== 'undefined' && typeof data.traits === 'object') ? true : false;
if (data && data.values) {
var getName = function(aaa, attr) {
DetailsResource.get({
id: attr.id
}, function(data1) {
if (data1.values && data1.values.name) {
attr.name = data1.values.name;
}
});
};
for (var aaa in data.values) {
if (typeof data.values[aaa] === 'object' && data.values[aaa] !== null && data.values[aaa].id && typeof data.values[aaa].id === 'string') {
data.values[aaa].name = data.values[aaa].id;
getName(aaa, data.values[aaa]);
}
if (typeof data.values[aaa] === 'object' && data.values[aaa] !== null && data.values[aaa].id && typeof data.values[aaa].id === 'object') {
data.values[aaa].id.name = data.values[aaa].id.id;
getName(aaa, data.values[aaa].id);
}
if (typeof data.values[aaa] === 'object' && angular.isArray(data.values[aaa]) === true) {
var arrObj = data.values[aaa];
for(var a=0; a < arrObj.length; a++){
if(typeof arrObj[a].id === 'string'){
arrObj[a].name = arrObj[a].id;
getName(arrObj[a], arrObj[a]);
}
}
}
}
}
$scope.details = data;
if (data && data.values && data.values.name && data.values.name !== "") {
SchemaResource.get({
tableName: data.values.name
......@@ -42,15 +75,15 @@ angular.module('dgc.details').controller('DetailsController', ['$window', '$scop
$scope.isSchema = (data1.results.rows && data1.results.rows.length > 0) ? true : false;
for (var t = 0; t < data1.results.rows.length; t++) {
if (data1.results.rows[t].$id$) {
$scope.isTraitId = true;
$scope.isTraitId = true;
}
if (data1.results.rows[t].type) {
$scope.isHiveSchema = true;
}
if($scope.isTraitId && $scope.isHiveSchema){
$scope.isHiveSchema = true;
}
if ($scope.isTraitId && $scope.isHiveSchema) {
break;
}
}
}
}
});
}
......@@ -68,7 +101,7 @@ angular.module('dgc.details').controller('DetailsController', ['$window', '$scop
$scope.$broadcast('render-lineage', {
type: tabname,
tableName: $scope.tableName,
guid : $stateParams.id
guid: $stateParams.id
});
};
......@@ -78,7 +111,6 @@ angular.module('dgc.details').controller('DetailsController', ['$window', '$scop
});
};
$scope.goDetails = function(id) {
$state.go("details", {
id: id
......
dashboard/public/modules/details/views/details.html
<!--
~ 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.
-->
~ 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.
-->
<div class="row detailsPage" data-ng-controller="DetailsController">
<div class="col-lg-12 padding0">
<ul class="breadcrumb">
<li><button class="btn btn-link" data-ng-click="goBack()"><i class="fa fa-arrow-left"></i> Back To Result</button> </li>
</ul>
</div>
<div role="tabpanel" class="col-lg-12 padding0">
<div class="mB20">
<h4 ng-if="details.values && details.values.name && details.values.name != ''">
<b>Name:</b> <span class="black">{{details.values.name}}</span></h2>
<h4 ng-if="details.values && details.values.description && details.values.description != ''"><b>Description:</b> <span class="black">{{details.values.description}}</span></h4>
<h4 data-disable="!tableName" data-select="onActivate('io')" id="lineageGraph" class="hide">
<span class="lineage">Lineage</span>
<ng-include data-table-type="io" src="'/modules/lineage/views/lineage_io.html'"/>
</h4>
</div>
<tabset>
<tab heading="Details">
<table class="table table-bordered">
<thead>
<tr>
<th>Key</th>
<th>Value</th>
</tr>
</thead>
<tbody>
<tr data-ng-repeat="(key,value) in details.values" ng-if="value && !(key==='columns') && !(key==='name') && !(key==='description')">
<td>{{key}}</td>
<td data-ng-if="isObject(value) && isString(value.id)" class="pointer">
<a data-ui-sref="details({id:value.id})">{{ value.id }}</a>
</td>
<td data-ng-if="isObject(value) && isObject(value.id) && isString(value.id.id)" class="pointer"> <a data-ui-sref="details({id:value.id.id})">{{ value.id.id }}</a>
</td>
<td data-ng-if="isObject(value) && !isArray(value) && !isString(value.id) && !isObject(value.id)">
<span data-ng-repeat="(key2, value2) in value"> {{ key2 }} : {{ value2 }}<span ng-if="!$last">,</span></span>
</td>
<td data-ng-if="isArray(value) && !isString(value.id) && !isObject(value.id)">
<div data-ng-repeat="(key2, value2) in value">
<a class=" pointer" data-ng-if="isObject(value2) && isString(value2.id)" data-ui-sref="details({id:value2.id})">{{ value2.id }}</a>
<div class="row pdLft15px" data-ng-repeat="(key1, value1) in value2">
<span ng-if="isObject(value1)">
<a class=" pointer" data-ng-if="isString(value1.id)" data-ui-sref="details({id:value1.id})">{{ value1.id }}</a>
</span>
</div>
</div>
</td>
<td data-ng-if="isArray(value) && !isObject(value)" >
<div class="row" data-ng-repeat="(key1, value1) in value" ng-if="value1">
<div data-ng-if="isObject(value1)" data-ng-repeat="(key2, value2) in value1" >
<a data-ng-if="isString(value2) && key2 == 'id'" class="pointer pdLft15px" data-ui-sref="details({id:value2})">{{ value2 }}</a>
</div>
</div>
</td>
<td data-ng-if="!isArray(value) && isObject(value[0]) && isString(value[0].id) && key=='inputTables'" data-ng-click="goDetails(value[0].id)" class="pointer">
<div class="row" data-ng-repeat="(key1, value1) in value[0]" ng-if="value1">
<div class="col-md-6" data-ng-if="!isString(value1)" data-ng-repeat="(key2, value2) in value1 track by $index"></div>
<div data-ng-if="isString(value2)" data-ng-repeat="(key3, value3) in value2"> {{key3}}: {{value3}}</div>
<div class="col-md-6" data-ng-if="isString(value1)"> {{key1}} : {{value1 | date:'medium'}} UTC</div>
</div>
</td>
<td data-ng-if="isNumber(value)">{{value * 1000 | date:'yyyy-MM-dd HH:mm:ss'}} UTC</td>
<td data-ng-if="isString(value)">{{value}}</td>
</tr>
</tbody>
</table>
</tab>
<tab data-heading="Schema" data-ng-if="isSchema">
<ng-include src="'/modules/details/views/schema.html'"/>
</tab>
<tab data-heading="Tags" data-ng-if="isTags">
<ng-include src="'/modules/tags/instance/views/tags.html'"/>
</tab>
</tabset>
</div>
</div>
\ No newline at end of file
<div class="col-lg-12 padding0">
<ul class="breadcrumb">
<li><button class="btn btn-link" data-ng-click="goBack()"><i class="fa fa-arrow-left"></i> Back To Result</button> </li>
</ul>
</div>
<div role="tabpanel" class="col-lg-12 padding0">
<div class="mB20">
<h4 ng-if="details.values && details.values.name && details.values.name != ''">
<b>Name:</b> <span class="black">{{details.values.name}}</span></h2>
<h4 ng-if="details.values && details.values.description && details.values.description != ''"><b>Description:</b> <span class="black">{{details.values.description}}</span></h4>
<h4 data-disable="!tableName" data-select="onActivate('io')" id="lineageGraph" class="hide">
<span class="lineage">Lineage</span>
<ng-include data-table-type="io" src="'/modules/lineage/views/lineage_io.html'"/>
</h4>
</div>
<tabset>
<tab heading="Details">
<table class="table table-bordered">
<thead>
<tr>
<th>Key</th>
<th>Value</th>
</tr>
</thead>
<tbody>
<tr data-ng-repeat="(key,value) in details.values" ng-if="value && !(key==='columns') && !(key==='name') && !(key==='description')">
<td>{{key}}</td>
<td data-ng-if="isObject(value) && isString(value.id)" class="pointer">
<a data-ui-sref="details({id:value.id})">{{ value.name }}</a>
</td>
<td data-ng-if="isObject(value) && isObject(value.id) && isString(value.id.id)" class="pointer"> <a data-ui-sref="details({id:value.id.id})">{{ value.id.name }}</a>
</td>
<td data-ng-if="isObject(value) && !isArray(value) && !isString(value.id) && !isObject(value.id)">
<span data-ng-repeat="(key2, value2) in value"> {{ key2 }} : {{ value2 }}<span ng-if="!$last">,</span></span>
</td>
<td data-ng-if="isArray(value) && !isString(value.id) && !isObject(value.id)">
<div data-ng-repeat="(key2, value2) in value">
<a class=" pointer" data-ng-if="isObject(value2) && isString(value2.id)" data-ui-sref="details({id:value2.id})">{{ value2.name }}<span ng-if="!$last">,</span></a>
<div class="row pdLft15px" data-ng-repeat="(key1, value1) in value2">
<span ng-if="isObject(value1)">
<a class=" pointer" data-ng-if="isString(value1.id)" data-ui-sref="details({id:value1.id})">{{ value1.id }}</a>
</span>
</div>
</div>
</td>
<td data-ng-if="isArray(value) && !isObject(value)" >
<div class="row" data-ng-repeat="(key1, value1) in value" ng-if="value1">
<div data-ng-if="isObject(value1)" data-ng-repeat="(key2, value2) in value1" >
<a data-ng-if="isString(value2) && key2 == 'id'" class="pointer pdLft15px" data-ui-sref="details({id:value2})">{{ value2 }}</a>
</div>
</div>
</td>
<td data-ng-if="!isArray(value) && isObject(value[0]) && isString(value[0].id) && key=='inputTables'" data-ng-click="goDetails(value[0].id)" class="pointer">
<div class="row" data-ng-repeat="(key1, value1) in value[0]" ng-if="value1">
<div class="col-md-6" data-ng-if="!isString(value1)" data-ng-repeat="(key2, value2) in value1 track by $index"></div>
<div data-ng-if="isString(value2)" data-ng-repeat="(key3, value3) in value2"> {{key3}}: {{value3}}</div>
<div class="col-md-6" data-ng-if="isString(value1)"> {{key1}} : {{value1 | date:'medium'}} UTC</div>
</div>
</td>
<td data-ng-if="isNumber(value)">{{value | date:'yyyy-MM-dd HH:mm:ss'}} UTC</td>
<td data-ng-if="isString(value)">{{value}}</td>
</tr>
</tbody>
</table>
</tab>
<tab data-heading="Schema" data-ng-if="isSchema">
<ng-include src="'/modules/details/views/schema.html'"/>
</tab>
<tab data-heading="Tags" data-ng-if="isTags">
<ng-include src="'/modules/tags/instance/views/tags.html'"/>
</tab>
</tabset>
</div>
</div>
dashboard/public/modules/search/searchController.js
......@@ -37,6 +37,58 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
$scope.setPage = function(pageNo) {
$scope.currentPage = pageNo;
};
$scope.initalPage = function() {
var begin = (($scope.currentPage - 1) * $scope.itemsPerPage),
end = begin + $scope.itemsPerPage,
currentRowData = [],
res = [],
count = 0,
firstRowId = 0;
if ($scope.transformedResults && $scope.transformedResults.length > 0) {
currentRowData = $scope.transformedResults.slice(begin, end);
}
var getName = function(gid, obj) {
DetailsResource.get({
id: gid
}, function(data) {
if (data.values && data.values.name) {
obj.name = data.values.name;
} else {
obj.name = gid;
}
res.push(obj);
count++;
$scope.filteredResults = res;
if (!$scope.transformedProperties && firstRowId === gid) {
$scope.transformedProperties = $scope.filterProperties();
}
});
};
angular.forEach(currentRowData, function(value) {
var objVal = value;
if (objVal.guid && !objVal.name) {
if (!firstRowId) {
firstRowId = objVal.guid;
}
getName(objVal.guid, objVal);
} else {
res.push(objVal);
count++;
$scope.filteredResults = res;
if (!$scope.transformedProperties) {
$scope.transformedProperties = $scope.filterProperties();
}
}
});
};
$scope.search = function(query) {
$scope.results = [];
NotificationService.reset();
......@@ -46,7 +98,6 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
SearchResource.search({
query: query
}, function searchSuccess(response) {
$scope.resultCount = response.count;
$scope.results = response.results;
$scope.resultRows = ($scope.results && $scope.results.rows) ? $scope.results.rows : $scope.results;
......@@ -84,13 +135,10 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
}
}
$scope.transformedResults = $scope.filterResults();
$scope.transformedProperties = $scope.filterProperties();
} else if (typeof response.dataType === 'undefined') {
$scope.dataTransitioned = true;
$scope.searchKey = '';
$scope.transformedResults = $scope.filterResults();
$scope.transformedProperties = $scope.filterProperties();
} else if (response.dataType.typeName && response.dataType.typeName.toLowerCase().indexOf('table') !== -1) {
$scope.searchKey = "Table";
$scope.transformedResults = $scope.resultRows;
......@@ -100,11 +148,7 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
}
$scope.$watch('currentPage + itemsPerPage', function() {
var begin = (($scope.currentPage - 1) * $scope.itemsPerPage),
end = begin + $scope.itemsPerPage;
if ($scope.transformedResults) {
$scope.filteredResults = $scope.transformedResults.slice(begin, end);
}
$scope.initalPage();
$scope.pageCount = function() {
return Math.ceil($scope.resultCount / $scope.itemsPerPage);
};
......@@ -125,9 +169,11 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
$scope.filterResults = function() {
var res = [];
if ($scope.searchKey !== '') {
angular.forEach($scope.resultRows, function(value) {
res.push(value[$scope.searchKey]);
var objVal = value[$scope.searchKey];
res.push(objVal);
});
} else {
angular.forEach($scope.resultRows, function(value) {
......@@ -161,7 +207,6 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
if (onlyId) {
objVal.guid = objVal.id;
}
res.push(objVal);
});
}
......@@ -189,11 +234,13 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
$scope.doToggle = function($event, el) {
this.isCollapsed = !el;
};
$scope.openAddTagHome = function(traitId) {
$state.go('addTagHome', {
tId: traitId
});
};
$scope.isTag = function(typename) {
if (typename.indexOf("__tempQueryResultStruct") > -1 || $scope.searchKey === '') {
......@@ -202,6 +249,7 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
return false;
}
};
$scope.getResourceDataHome = function(event, id) {
DetailsResource.get({
id: id
......@@ -215,7 +263,9 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
}
});
};
$scope.$on('refreshResourceData', $scope.getResourceDataHome);
$scope.filterSearchResults = function(items) {
var res = {};
var count = 0;
......@@ -229,10 +279,12 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
$scope.keyLength = count;
return res;
};
$scope.searchQuery = $location.search();
$scope.query = ($location.search()).query;
if ($scope.query) {
if ($scope.query) {
$scope.search($scope.query);
}
}
......
dashboard/public/modules/search/views/search.html
......@@ -49,7 +49,7 @@
<th>Tools</th>
</tr>
<tr ng-if="isTag(resultType) && transformedProperties != undefined" >
<th ng-repeat="prop in transformedProperties" ng-if="prop !== 'id'">
<th ng-repeat="prop in transformedProperties" ng-if="prop !== 'id' && prop !== 'guid'">
{{(prop != '$traits$') ? prop : 'Tags'}}
</th>
</tr>
......@@ -73,17 +73,17 @@
<td class="addTag"><img ng-src="img/addTag.png" tooltip="Add Tag" ng-click="openAddTagHome(result['$id$'].id || result.guid)"></td>
</tr>
<tr ng-if="isTag(resultType)" ng-repeat="result in filteredResults track by $index">
<td data-ng-if="isObject(result) && !isString(result) && res != 'id'" data-ng-repeat="res in transformedProperties track by $index" class="wordBreak">
<td data-ng-if="isObject(result) && !isString(result) && res != 'id' && res != 'guid'" data-ng-repeat="res in transformedProperties track by $index">
<a data-ng-if="res == 'guid'" data-ui-sref="details({id:result[res]})">{{result[res]}}</a>
<a data-ng-if="res == 'guid' && !result['name']" data-ui-sref="details({id:result[res]})">{{result[res]}}</a>
<span data-ng-if="res != '$traits$' && res != 'Tools' && res != 'guid' && res.toLowerCase().indexOf('name') == -1 && res.toLowerCase().indexOf('time') == -1">{{result[res]}}</span>
<span data-ng-if="res.toLowerCase().indexOf('time') != -1 && isNumber(result[res])">{{result[res] * 1000 | date:'yyyy-MM-dd HH:mm:ss'}} UTC</span>
<a data-ng-if="res.toLowerCase().indexOf('name') != -1 && result['id']" data-ui-sref="details({id:result['id']|| result['guid']})">{{result[res]}}</a>
<a data-ng-if="res.toLowerCase().indexOf('name') != -1 && (result['id'] || result['guid']) " data-ui-sref="details({id:result['id']|| result['guid']})">{{result[res]}}</a>
<span data-ng-if="res.toLowerCase().indexOf('name') != -1 && !result['id']">{{result[res]}}</span>
<span data-ng-if="res.toLowerCase().indexOf('name') != -1 && !result['id'] && !result['guid']">{{result[res]}}</span>
<div data-ng-if="res == '$traits$'" class="wordBreak tags" id="{{result['id']|| result['guid']}}">
<a class="tabsearchanchor" ng-repeat="(key, value) in result[res]" data-ui-sref="search({query: key})" title="{{key}}">{{key}}<span> </span></a>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment