ATLAS-3027 : UI : Metric modal Improvements
Project: http://git-wip-us.apache.org/repos/asf/atlas/repo Commit: http://git-wip-us.apache.org/repos/asf/atlas/commit/e8b32778 Tree: http://git-wip-us.apache.org/repos/asf/atlas/tree/e8b32778 Diff: http://git-wip-us.apache.org/repos/asf/atlas/diff/e8b32778 Branch: refs/heads/master Commit: e8b32778cad16a61bcb6341b32fee90301028f71 Parents: 665f831 Author: kevalbhatt <kbh...@apache.org> Authored: Thu Jan 10 18:50:03 2019 +0530 Committer: kevalbhatt <kbh...@apache.org> Committed: Thu Jan 10 19:25:48 2019 +0530 ---------------------------------------------------------------------- dashboardv2/public/css/scss/override.scss | 2 +- dashboardv2/public/css/scss/style.scss | 1 + dashboardv2/public/css/scss/table.scss | 31 ++++++++++++++++++++ dashboardv2/public/js/router/Router.js | 4 +-- .../js/templates/common/Statistics_tmpl.html | 16 +++++----- .../public/js/views/common/Statistics.js | 23 +++++++++++---- 6 files changed, 61 insertions(+), 16 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/atlas/blob/e8b32778/dashboardv2/public/css/scss/override.scss ---------------------------------------------------------------------- diff --git a/dashboardv2/public/css/scss/override.scss b/dashboardv2/public/css/scss/override.scss index 2dca3a5..5754aac 100644 --- a/dashboardv2/public/css/scss/override.scss +++ b/dashboardv2/public/css/scss/override.scss @@ -50,7 +50,7 @@ .modal-body { position: relative; padding: 15px; - max-height: 400px; + max-height: 72vh; min-height: 70px; overflow: auto; http://git-wip-us.apache.org/repos/asf/atlas/blob/e8b32778/dashboardv2/public/css/scss/style.scss ---------------------------------------------------------------------- diff --git a/dashboardv2/public/css/scss/style.scss b/dashboardv2/public/css/scss/style.scss index cd1781b..904aa4e 100644 --- a/dashboardv2/public/css/scss/style.scss +++ b/dashboardv2/public/css/scss/style.scss @@ -19,6 +19,7 @@ @import "__mixin.scss"; @import "__variable.scss"; @import "common.scss"; +@import "table.scss"; @import "tab.scss"; @import "form.scss"; @import "nav.scss"; http://git-wip-us.apache.org/repos/asf/atlas/blob/e8b32778/dashboardv2/public/css/scss/table.scss ---------------------------------------------------------------------- diff --git a/dashboardv2/public/css/scss/table.scss b/dashboardv2/public/css/scss/table.scss new file mode 100644 index 0000000..7aa4774 --- /dev/null +++ b/dashboardv2/public/css/scss/table.scss @@ -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. + */ + +.stat-table { + + tbody, + thead { + >tr { + + td:nth-child(2), + th:nth-child(2) { + text-align: right; + } + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/atlas/blob/e8b32778/dashboardv2/public/js/router/Router.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/router/Router.js b/dashboardv2/public/js/router/Router.js index 1bb98a1..9f4536e 100644 --- a/dashboardv2/public/js/router/Router.js +++ b/dashboardv2/public/js/router/Router.js @@ -76,8 +76,8 @@ define([ $('body').on('click', 'a.show-stat', function() { require([ 'views/common/Statistics', - ], function(AboutAtlas) { - new AboutAtlas(); + ], function(Statistics) { + new Statistics(); }); }); $('body').on('click', 'li.aboutAtlas', function() { http://git-wip-us.apache.org/repos/asf/atlas/blob/e8b32778/dashboardv2/public/js/templates/common/Statistics_tmpl.html ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/templates/common/Statistics_tmpl.html b/dashboardv2/public/js/templates/common/Statistics_tmpl.html index cecdf20..13e64a7 100644 --- a/dashboardv2/public/js/templates/common/Statistics_tmpl.html +++ b/dashboardv2/public/js/templates/common/Statistics_tmpl.html @@ -15,10 +15,10 @@ * limitations under the License. --> <div class="panel-group" id="accordion"> - <div class="panel panel-default expand_collapse_panel-icon"> + <div class="panel panel-default expand_collapse_panel-icon" data-id="entityActive"> <div class="panel-heading" data-toggle="collapse" href="#collapse1" aria-expanded="true"> <h4 class="panel-title"> - <a>Active Entities</a> + <a>Active Entities <span class="count">(0)</span></a> </h4> <div class="btn-group pull-right"> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button> @@ -26,23 +26,23 @@ </div> <div id="collapse1" class="panel-collapse collapse in"> <div class="panel-body"> - <table class="table table-quickMenu"> + <table class="table stat-table"> <thead> <tr> <th>Entity</th> <th>Count</th> </tr> </thead> - <tbody data-id="entityActive"> + <tbody > </tbody> </table> </div> </div> </div> - <div class="panel panel-default expand_collapse_panel-icon"> + <div class="panel panel-default expand_collapse_panel-icon" data-id="entityDelete"> <div class="panel-heading" data-toggle="collapse" href="#collapse2"> <h4 class="panel-title"> - <a>Deleted Entities</a> + <a>Deleted Entities <span class="count">(0)</span></a> </h4> <div class="btn-group pull-right"> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button> @@ -50,14 +50,14 @@ </div> <div id="collapse2" class="panel-collapse collapse"> <div class="panel-body"> - <table class="table table-quickMenu"> + <table class="table stat-table"> <thead> <tr> <th>Entity</th> <th>Count</th> </tr> </thead> - <tbody data-id="entityDelete"> + <tbody > </tbody> </table> </div> http://git-wip-us.apache.org/repos/asf/atlas/blob/e8b32778/dashboardv2/public/js/views/common/Statistics.js ---------------------------------------------------------------------- diff --git a/dashboardv2/public/js/views/common/Statistics.js b/dashboardv2/public/js/views/common/Statistics.js index 0f567e2..11c5463 100644 --- a/dashboardv2/public/js/views/common/Statistics.js +++ b/dashboardv2/public/js/views/common/Statistics.js @@ -35,8 +35,10 @@ define(['require', regions: {}, /** ui selector cache */ ui: { - entityActive: "[data-id='entityActive']", - entityDelete: "[data-id='entityDelete']" + entityActive: "[data-id='entityActive'] tbody", + entityDelete: "[data-id='entityDelete'] tbody", + entityActiveHeader: "[data-id='entityActive'] .count", + entityDeletedHeader: "[data-id='entityDelete'] .count" }, /** ui events hash */ events: function() {}, @@ -51,7 +53,7 @@ define(['require', content: this, okCloses: true, showFooter: true, - allowCancel: false, + allowCancel: false }).open(); modal.on('closeModal', function() { @@ -70,12 +72,23 @@ define(['require', no_records = '<tr class="empty text-center"><td colspan="2"><span>No records found!</span></td></tr>', activeEntityTable = _.isEmpty(data.entity.entityActive) ? no_records : CommonViewFunction.propertyTable({ scope: that, valueObject: data.entity.entityActive }), deleteEntityTable = _.isEmpty(data.entity.entityDeleted) ? no_records : CommonViewFunction.propertyTable({ scope: that, valueObject: data.entity.entityDeleted }); + var totalActive = 0, + totalDeleted = 0; + if (data.entity && data.general.entityCount) { + totalActive = data.general.entityCount; + } + if (data.entity && data.entity.entityDeleted) { + _.each(data.entity.entityDeleted, function(val) { + totalDeleted += val; + }); + } that.ui.entityActive.html(activeEntityTable); that.ui.entityDelete.html(deleteEntityTable); + that.ui.entityActiveHeader.html(" (" + (totalActive - totalDeleted) + ")"); + that.ui.entityDeletedHeader.html(" (" + totalDeleted + ")"); } }); - }, - + } }); return StatisticsView; }); \ No newline at end of file