Skip to content

A
atlas
Commit e04acda4 by kevalbhatt Committed by Sarath Subramanian
Options

ATLAS-3471: Regression : UI - Relationship attributes are not displayed in Audit Details Table

Signed-off-by: 's avatarSarath Subramanian <sarath@apache.org>
parent 57b52a29
Showing with 379 additions and 64 deletions
dashboardv2/public/css/scss/common.scss
...@@ -207,7 +207,7 @@ pre { ...@@ -207,7 +207,7 @@ pre {
.footer-content { .footer-content {
position: fixed; position: fixed;
right: 0px; right: 0px;
padding: 10px; padding: 2px;
bottom: 0; bottom: 0;
background: white; background: white;
} }
...@@ -215,6 +215,7 @@ pre { ...@@ -215,6 +215,7 @@ pre {
#accordion { #accordion {
.panel-default>.panel-heading { .panel-default>.panel-heading {
cursor: pointer; cursor: pointer;
width: 100%;
} }
} }
......
dashboardv2/public/js/templates/audit/CreateAuditTableLayoutView_tmpl.html
...@@ -14,13 +14,111 @@ ...@@ -14,13 +14,111 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
--> -->
<h4>Name: <span data-id="name"></span></h4> <h4 style="word-break: break-word;">Name: <span data-id="name"></span></h4>
<table class="table table-bordered table-striped" data-id="tableAudit"> <div class="panel-group server-stats-container statsContainer " id="accordion">
<thead> <div class="panel panel-default custom-panel expand_collapse_panel-icon hide" data-id="detailsAttribute">
<tr data-id="auditHeaderValue"> <div class="panel-heading" data-toggle="collapse" href="#detailAttributeTableCollapse" aria-expanded="true">
</tr> <h4 class="panel-title">
</thead> <a>Properties </a>
<tbody data-id="auditValue"> </h4>
</tbody> <div class="btn-group pull-left">
</table> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
<h4 data-id="noData" style="display:none">No details to show</h4> </div>
</div>
<div id="detailAttributeTableCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<table class="table stat-table">
<tbody data-id="attributeDetail-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon hide" data-id="attributeDetails">
<div class="panel-heading" data-toggle="collapse" href="#attributeTableCollapse" aria-expanded="true">
<h4 class="panel-title">
<a data-id="panel-attr-heading">Technical properties </a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="attributeTableCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<table class="table stat-table">
<tbody data-id="attribute-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon hide" data-id="relationShipAttributeDetails">
<div class="panel-heading" data-toggle="collapse" href="#relationShipAttributeTableCollapse" aria-expanded="true">
<h4 class="panel-title">
<a>Relationship properties </a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="relationShipAttributeTableCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<table class="table stat-table">
<tbody data-id="relationship-attr-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon hide" data-id="customAttributeDetails">
<div class="panel-heading" data-toggle="collapse" href="#customAttributeCollapse" aria-expanded="true">
<h4 class="panel-title">
<a>User-defined properties </a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="customAttributeCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<table class="table stat-table">
<tbody data-id="custom-attr-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon hide" data-id="labelsDetails">
<div class="panel-heading" data-toggle="collapse" href="#labelsTableCollapse" aria-expanded="true">
<h4 class="panel-title">
<a>Labels</a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="labelsTableCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<div class="row">
<div class="col-md-12">
<div class="badge-container" data-id="label-card">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<h4 data-id="noData" class="text-center hide"><i>No details to show!</i></h4>
\ No newline at end of file
dashboardv2/public/js/views/audit/CreateAuditTableLayoutView.js
...@@ -38,11 +38,23 @@ define(['require', ...@@ -38,11 +38,23 @@ define(['require',
/** ui selector cache */ /** ui selector cache */
ui: { ui: {
auditValue: "[data-id='auditValue']", auditValue: "[data-id='auditValue']",
auditCreate: "[data-id='auditCreate']", name: "[data-id='name']",
noData: "[data-id='noData']", noData: "[data-id='noData']",
tableAudit: "[data-id='tableAudit']", tableAudit: "[data-id='tableAudit']",
auditHeaderValue: "[data-id='auditHeaderValue']", auditHeaderValue: "[data-id='auditHeaderValue']",
name: "[data-id='name']" attributeDetails: "[data-id='attributeDetails']",
attributeCard: "[data-id='attribute-card']",
labelsDetailsTable: "[data-id='labelsDetails']",
labelCard: "[data-id='label-card']",
customAttributeDetails: "[data-id='customAttributeDetails']",
customAttrCard: "[data-id='custom-attr-card']",
relationShipAttributeDetails: "[data-id='relationShipAttributeDetails']",
relationshipAttrCard: "[data-id='relationship-attr-card']",
attributeDetailCard: "[data-id='attributeDetail-card']",
detailsAttribute: "[data-id='detailsAttribute']",
panelAttrHeading: "[data-id='panel-attr-heading']",
nameUpdate: "[data-id='name-update']"
}, },
/** ui events hash */ /** ui events hash */
events: function() { events: function() {
...@@ -61,6 +73,20 @@ define(['require', ...@@ -61,6 +73,20 @@ define(['require',
onRender: function() { onRender: function() {
this.auditTableGenerate(); this.auditTableGenerate();
}, },
createTableWithValues: function(tableDetails) {
var attrTable = CommonViewFunction.propertyTable({
scope: this,
valueObject: tableDetails
});
return attrTable;
},
updateName: function(name) {
this.ui.name.text(name);
},
noDetailsShow: function() {
this.ui.noData.removeClass('hide');
},
auditTableGenerate: function() { auditTableGenerate: function() {
var that = this, var that = this,
table = ""; table = "";
...@@ -78,32 +104,62 @@ define(['require', ...@@ -78,32 +104,62 @@ define(['require',
if (name == "-") { if (name == "-") {
name = _.escape(parseDetailsObject.typeName); name = _.escape(parseDetailsObject.typeName);
} }
var name = ((name ? name : this.entityName));
that.updateName(name);
if (parseDetailsObject) {
var attributesDetails = parseDetailsObject.attributes,
customAttr = parseDetailsObject.customAttributes,
labelsDetails = parseDetailsObject.labels,
relationshipAttributes = parseDetailsObject.relationshipAttributes;
if (attributesDetails) {
that.ui.attributeDetails.removeClass('hide');
that.action.indexOf("Classification") === -1 ? that.ui.panelAttrHeading.html("Technical properties ") : that.ui.panelAttrHeading.html("Properties ");
var attrTable = that.createTableWithValues(attributesDetails);
that.ui.attributeCard.html(
attrTable);
}
if (!_.isEmpty(customAttr)) {
that.ui.customAttributeDetails.removeClass('hide');
var customAttrTable = that.createTableWithValues(customAttr);
that.ui.customAttrCard.html(
customAttrTable);
}
if (!_.isEmpty(labelsDetails)) {
this.ui.labelsDetailsTable.removeClass('hide');
var labelsTable = '';
_.each(labelsDetails, function(value, key, list) {
labelsTable += "<label class='label badge-default'>" + value + "</label>";
});
that.ui.labelCard.html(
labelsTable);
}
if (!_.isEmpty(relationshipAttributes)) {
that.ui.relationShipAttributeDetails.removeClass('hide');
var relationshipAttrTable = that.createTableWithValues(relationshipAttributes);
that.ui.relationshipAttrCard.html(
relationshipAttrTable);
}
if (!attributesDetails && !customAttr && !labelsDetails && !relationshipAttributes) {
that.ui.detailsAttribute.removeClass('hide');
var attrDetailTable = that.createTableWithValues(parseDetailsObject);
that.ui.attributeDetailCard.html(
attrDetailTable);
}
} else {
that.noDetailsShow();
}
} catch (err) { } catch (err) {
if (_.isArray(parseDetailsObject)) { if (_.isArray(parseDetailsObject)) {
var name = _.escape(parseDetailsObject[0]); var name = _.escape(parseDetailsObject[0]);
} }
that.updateName(name);
that.noDetailsShow();
} }
var name = ((name ? name : this.entityName));
this.ui.name.text(name);
if (parseDetailsObject) {
this.ui.auditHeaderValue.html('<th>Key</th><th>New Value</th>');
var value = parseDetailsObject.attributes || parseDetailsObject;
table = CommonViewFunction.propertyTable({ scope: this, valueObject: value, attributeDefs: this.attributeDefs });
if (table.length) {
this.ui.noData.hide();
this.ui.tableAudit.show();
this.ui.auditValue.html(table);
} else {
this.ui.noData.show();
this.ui.tableAudit.hide();
}
} else {
this.ui.noData.show();
}
} else if (detailObj == "Deleted entity") { } else if (detailObj == "Deleted entity") {
this.ui.name.text(this.entityName); that.updateName(this.entityName);
} }
}, }
}); });
return CreateAuditTableLayoutView; return CreateAuditTableLayoutView;
}); });
\ No newline at end of file
dashboardv3/public/css/scss/common.scss
...@@ -205,13 +205,14 @@ pre { ...@@ -205,13 +205,14 @@ pre {
#accordion { #accordion {
.panel-default>.panel-heading { .panel-default>.panel-heading {
cursor: pointer; cursor: pointer;
width: 100%;
} }
} }
.footer-content { .footer-content {
position: fixed; position: fixed;
right: 0px; right: 0px;
padding: 10px; padding: 2px;
bottom: 0; bottom: 0;
background: white; background: white;
} }
......
dashboardv3/public/css/scss/theme.scss
...@@ -34,6 +34,7 @@ body { ...@@ -34,6 +34,7 @@ body {
#page-wrapper { #page-wrapper {
padding-top: 15px !important; padding-top: 15px !important;
padding-bottom: 10px !important;
} }
// &:after { // &:after {
......
dashboardv3/public/js/templates/audit/CreateAuditTableLayoutView_tmpl.html
...@@ -14,13 +14,111 @@ ...@@ -14,13 +14,111 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
--> -->
<h4>Name: <span data-id="name"></span></h4> <h4 style="word-break: break-word;">Name: <span data-id="name"></span></h4>
<table class="table table-bordered table-striped" data-id="tableAudit"> <div class="panel-group server-stats-container statsContainer " id="accordion">
<thead> <div class="panel panel-default custom-panel expand_collapse_panel-icon hide" data-id="detailsAttribute">
<tr data-id="auditHeaderValue"> <div class="panel-heading" data-toggle="collapse" href="#detailAttributeTableCollapse" aria-expanded="true">
</tr> <h4 class="panel-title">
</thead> <a>Properties </a>
<tbody data-id="auditValue"> </h4>
</tbody> <div class="btn-group pull-left">
</table> <button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
<h4 data-id="noData" style="display:none">No details to show</h4> </div>
</div>
<div id="detailAttributeTableCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<table class="table stat-table">
<tbody data-id="attributeDetail-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon hide" data-id="attributeDetails">
<div class="panel-heading" data-toggle="collapse" href="#attributeTableCollapse" aria-expanded="true">
<h4 class="panel-title">
<a data-id="panel-attr-heading">Technical properties </a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="attributeTableCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<table class="table stat-table">
<tbody data-id="attribute-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon hide" data-id="relationShipAttributeDetails">
<div class="panel-heading" data-toggle="collapse" href="#relationShipAttributeTableCollapse" aria-expanded="true">
<h4 class="panel-title">
<a>Relationship properties </a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="relationShipAttributeTableCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<table class="table stat-table">
<tbody data-id="relationship-attr-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon hide" data-id="customAttributeDetails">
<div class="panel-heading" data-toggle="collapse" href="#customAttributeCollapse" aria-expanded="true">
<h4 class="panel-title">
<a>User-defined properties </a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="customAttributeCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<table class="table stat-table">
<tbody data-id="custom-attr-card">
<tr class="empty text-center">
<td colspan="3"><span>No records found!</span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="panel panel-default custom-panel expand_collapse_panel-icon hide" data-id="labelsDetails">
<div class="panel-heading" data-toggle="collapse" href="#labelsTableCollapse" aria-expanded="true">
<h4 class="panel-title">
<a>Labels</a>
</h4>
<div class="btn-group pull-left">
<button type="button" title="Collapse"><i class="ec-icon fa"></i></button>
</div>
</div>
<div id="labelsTableCollapse" class="panel-collapse collapse in">
<div class="panel-body">
<div class="row">
<div class="col-md-12">
<div class="badge-container" data-id="label-card">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<h4 data-id="noData" class="text-center hide"><i>No details to show!</i></h4>
\ No newline at end of file
dashboardv3/public/js/views/audit/CreateAuditTableLayoutView.js
...@@ -38,11 +38,23 @@ define(['require', ...@@ -38,11 +38,23 @@ define(['require',
/** ui selector cache */ /** ui selector cache */
ui: { ui: {
auditValue: "[data-id='auditValue']", auditValue: "[data-id='auditValue']",
auditCreate: "[data-id='auditCreate']", name: "[data-id='name']",
noData: "[data-id='noData']", noData: "[data-id='noData']",
tableAudit: "[data-id='tableAudit']", tableAudit: "[data-id='tableAudit']",
auditHeaderValue: "[data-id='auditHeaderValue']", auditHeaderValue: "[data-id='auditHeaderValue']",
name: "[data-id='name']" attributeDetails: "[data-id='attributeDetails']",
attributeCard: "[data-id='attribute-card']",
labelsDetailsTable: "[data-id='labelsDetails']",
labelCard: "[data-id='label-card']",
customAttributeDetails: "[data-id='customAttributeDetails']",
customAttrCard: "[data-id='custom-attr-card']",
relationShipAttributeDetails: "[data-id='relationShipAttributeDetails']",
relationshipAttrCard: "[data-id='relationship-attr-card']",
attributeDetailCard: "[data-id='attributeDetail-card']",
detailsAttribute: "[data-id='detailsAttribute']",
panelAttrHeading: "[data-id='panel-attr-heading']",
nameUpdate: "[data-id='name-update']"
}, },
/** ui events hash */ /** ui events hash */
events: function() { events: function() {
...@@ -61,6 +73,20 @@ define(['require', ...@@ -61,6 +73,20 @@ define(['require',
onRender: function() { onRender: function() {
this.auditTableGenerate(); this.auditTableGenerate();
}, },
createTableWithValues: function(tableDetails) {
var attrTable = CommonViewFunction.propertyTable({
scope: this,
valueObject: tableDetails
});
return attrTable;
},
updateName: function(name) {
this.ui.name.text(name);
},
noDetailsShow: function() {
this.ui.noData.removeClass('hide');
},
auditTableGenerate: function() { auditTableGenerate: function() {
var that = this, var that = this,
table = ""; table = "";
...@@ -78,32 +104,62 @@ define(['require', ...@@ -78,32 +104,62 @@ define(['require',
if (name == "-") { if (name == "-") {
name = _.escape(parseDetailsObject.typeName); name = _.escape(parseDetailsObject.typeName);
} }
var name = ((name ? name : this.entityName));
that.updateName(name);
if (parseDetailsObject) {
var attributesDetails = parseDetailsObject.attributes,
customAttr = parseDetailsObject.customAttributes,
labelsDetails = parseDetailsObject.labels,
relationshipAttributes = parseDetailsObject.relationshipAttributes;
if (attributesDetails) {
that.ui.attributeDetails.removeClass('hide');
that.action.indexOf("Classification") === -1 ? that.ui.panelAttrHeading.html("Technical properties ") : that.ui.panelAttrHeading.html("Properties ");
var attrTable = that.createTableWithValues(attributesDetails);
that.ui.attributeCard.html(
attrTable);
}
if (!_.isEmpty(customAttr)) {
that.ui.customAttributeDetails.removeClass('hide');
var customAttrTable = that.createTableWithValues(customAttr);
that.ui.customAttrCard.html(
customAttrTable);
}
if (!_.isEmpty(labelsDetails)) {
this.ui.labelsDetailsTable.removeClass('hide');
var labelsTable = '';
_.each(labelsDetails, function(value, key, list) {
labelsTable += "<label class='label badge-default'>" + value + "</label>";
});
that.ui.labelCard.html(
labelsTable);
}
if (!_.isEmpty(relationshipAttributes)) {
that.ui.relationShipAttributeDetails.removeClass('hide');
var relationshipAttrTable = that.createTableWithValues(relationshipAttributes);
that.ui.relationshipAttrCard.html(
relationshipAttrTable);
}
if (!attributesDetails && !customAttr && !labelsDetails && !relationshipAttributes) {
that.ui.detailsAttribute.removeClass('hide');
var attrDetailTable = that.createTableWithValues(parseDetailsObject);
that.ui.attributeDetailCard.html(
attrDetailTable);
}
} else {
that.noDetailsShow();
}
} catch (err) { } catch (err) {
if (_.isArray(parseDetailsObject)) { if (_.isArray(parseDetailsObject)) {
var name = _.escape(parseDetailsObject[0]); var name = _.escape(parseDetailsObject[0]);
} }
that.updateName(name);
that.noDetailsShow();
} }
var name = ((name ? name : this.entityName));
this.ui.name.text(name);
if (parseDetailsObject) {
this.ui.auditHeaderValue.html('<th>Key</th><th>New Value</th>');
var value = parseDetailsObject.attributes || parseDetailsObject;
table = CommonViewFunction.propertyTable({ scope: this, valueObject: value, attributeDefs: this.attributeDefs });
if (table.length) {
this.ui.noData.hide();
this.ui.tableAudit.show();
this.ui.auditValue.html(table);
} else {
this.ui.noData.show();
this.ui.tableAudit.hide();
}
} else {
this.ui.noData.show();
}
} else if (detailObj == "Deleted entity") { } else if (detailObj == "Deleted entity") {
this.ui.name.text(this.entityName); that.updateName(this.entityName);
} }
}, }
}); });
return CreateAuditTableLayoutView; return CreateAuditTableLayoutView;
}); });
\ No newline at end of file
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