Skip to content

A
atlas
Commit 75bdf791 by gutkaBinit Committed by kevalbhatt
Options

ATLAS-3145 UI :Entity showing Active even if the relationshipStatus is Deleted.

parent 2c9376f8
Showing with 112 additions and 21 deletions
dashboardv2/public/css/scss/graph.scss
...@@ -61,7 +61,6 @@ ...@@ -61,7 +61,6 @@
&.node-detail-highlight { &.node-detail-highlight {
stroke: $color_havelock_blue_approx; stroke: $color_havelock_blue_approx;
stroke-width: 2px; stroke-width: 2px;
opacity: 0.8;
} }
&.nodeImage { &.nodeImage {
...@@ -268,9 +267,6 @@ g.type-TK>rect { ...@@ -268,9 +267,6 @@ g.type-TK>rect {
text-align: left; text-align: left;
&.deleted-relation { &.deleted-relation {
a {
color: #BB5838 !important;
}
.deleteBtn { .deleteBtn {
padding: 2px 8px !important; padding: 2px 8px !important;
...@@ -431,4 +427,23 @@ span#zoom_in { ...@@ -431,4 +427,23 @@ span#zoom_in {
.hidden-svg { .hidden-svg {
visibility: hidden; visibility: hidden;
}
#tab-relationship {
.entity-status {
&.active {
color: $color_jungle_green_approx;
}
&.deleted {
color: $delete_link;
}
}
.entity-list {
list-style-position: inside;
}
} }
\ No newline at end of file
dashboardv2/public/js/templates/graph/RelationshipLayoutView_tmpl.html
...@@ -23,9 +23,15 @@ ...@@ -23,9 +23,15 @@
</label> </label>
<span class="pull-left">Table</span> <span class="pull-left">Table</span>
</div> </div>
<div class="btn-group pull-right" data-id="zoomControl"> <div class="pull-right" data-id="zoomControl">
<button type="button" id="zoom_in" class="btn btn-action btn-gray btn-sm lineageZoomButton" title="Zoom In" data-id="refreshBtn"> <i class="fa fa-search-plus"></i></button> <div class="btn-group pull-right">
<button type="button" id="zoom_out" class="btn btn-action btn-gray btn-sm lineageZoomButton" title="Zoom Out" data-id="refreshBtn"> <i class="fa fa-search-minus"></i></button> <button type="button" id="zoom_in" class="btn btn-action btn-gray btn-sm lineageZoomButton" title="Zoom In" data-id="refreshBtn"> <i class="fa fa-search-plus"></i></button>
<button type="button" id="zoom_out" class="btn btn-action btn-gray btn-sm lineageZoomButton" title="Zoom Out" data-id="refreshBtn"> <i class="fa fa-search-minus"></i></button>
</div>
<div class="btn-group pull-right" style="padding: 4px 15px;">
<span class="entity-status active" title="Active Entity"><i class="fa fa-long-arrow-right fa-fw" aria-hidden="true"></i>Active</span>
<span class="entity-status deleted" title="Deleted Entity"><i class="fa fa-long-arrow-right fa-fw" aria-hidden="true"></i>Deleted</span>
</div>
</div> </div>
</div> </div>
<div class="white-bg no-padding relationship-box invisible" data-id='relationshipSVG'> <div class="white-bg no-padding relationship-box invisible" data-id='relationshipSVG'>
......
dashboardv2/public/js/views/graph/RelationshipLayoutView.js
...@@ -143,14 +143,84 @@ define(['require', ...@@ -143,14 +143,84 @@ define(['require',
var data = options.obj.value, var data = options.obj.value,
typeName = data.typeName || options.obj.name, typeName = data.typeName || options.obj.name,
searchString = options.searchString, searchString = options.searchString,
listString = ""; listString = "",
getEntityTypelist = function(options) {
var activeEntityColor = "#4a90e2",
deletedEntityColor = "#BB5838",
entityTypeHtml = '',
getdefault = function(obj) {
var options = obj.options,
status = (Enums.entityStateReadOnly[options.entityStatus || options.status] ? " deleted-relation" : ''),
guid = options.guid,
entityColor = obj.color,
name = obj.name,
typeName = options.typeName;
return "<li class=" + status + ">" +
"<a style='color:" + entityColor + "' href=#!/detailPage/" + guid + "?tabActive=relationship>" + name + " (" + typeName + ")</a>" +
"</li>";
},
getWithButton = function(obj) {
var options = obj.options,
status = (Enums.entityStateReadOnly[options.entityStatus || options.status] ? " deleted-relation" : ''),
guid = options.guid,
entityColor = obj.color,
name = obj.name,
typeName = options.typeName,
relationship = obj.relationship || false,
entity = obj.entity || false,
icon = '<i class="fa fa-trash"></i>',
title = "Deleted";
if (relationship) {
icon = '<i class="fa fa-long-arrow-right"></i>';
status = (Enums.entityStateReadOnly[options.relationshipStatus || options.status] ? "deleted-relation" : '');
title = "Relationship Deleted";
}
return "<li class=" + status + ">" +
"<a style='color:" + entityColor + "' href=#!/detailPage/" + options.guid + "?tabActive=relationship>" + _.escape(name) + " (" + options.typeName + ")</a>" +
'<button type="button" title="' + title + '" class="btn btn-sm deleteBtn deletedTableBtn btn-action ">' + icon + '</button>' +
"</li>";
};
var name = options.entityName ? options.entityName : Utils.getName(options, "displayText");
if (options.entityStatus == "ACTIVE") {
if (options.relationshipStatus == "ACTIVE") {
entityTypeHtml = getdefault({
"color": activeEntityColor,
"options": options,
"name": _.escape(name)
});
} else if (options.relationshipStatus == "DELETED") {
entityTypeHtml = getWithButton({
"color": activeEntityColor,
"options": options,
"name": _.escape(name),
"relationship": true
})
}
} else if (options.entityStatus == "DELETED") {
entityTypeHtml = getWithButton({
"color": deletedEntityColor,
"options": options,
"name": _.escape(name),
"entity": true
})
} else {
entityTypeHtml = getdefault({
"color": activeEntityColor,
"options": options,
"name": _.escape(name)
});
}
return entityTypeHtml;
};
this.ui.searchNode.hide(); this.ui.searchNode.hide();
this.$("[data-id='typeName']").text(typeName); this.$("[data-id='typeName']").text(typeName);
var getElement = function(options) { var getElement = function(options) {
var name = options.entityName ? options.entityName : Utils.getName(options, "displayText"); var name = options.entityName ? options.entityName : Utils.getName(options, "displayText");
return "<li class=" + (Enums.entityStateReadOnly[options.entityStatus || options.status] ? "deleted-relation" : '') + "><a href=#!/detailPage/" + options.guid + "?tabActive=relationship>" + _.escape(name) + " (" + options.typeName + ")</a>" + var entityTypeButton = getEntityTypelist(options);
'<button type="button" title="Deleted" class="btn btn-sm deleteBtn deletedTableBtn ' + (Enums.entityStateReadOnly[options.entityStatus || options.status] ? "" : 'hide') + '"><i class="fa fa-trash"></i></button>' + return entityTypeButton;
"</li>";
} }
if (_.isArray(data)) { if (_.isArray(data)) {
if (data.length > 1) { if (data.length > 1) {
...@@ -182,7 +252,8 @@ define(['require', ...@@ -182,7 +252,8 @@ define(['require',
var scale = 1.0, var scale = 1.0,
activeEntityColor = "#00b98b", activeEntityColor = "#00b98b",
deletedEntityColor = "#BB5838", deletedEntityColor = "#BB5838",
defaultEntityColor = "#e0e0e0"; defaultEntityColor = "#e0e0e0",
selectedNodeColor = "#4a90e2";
var force = d3.layout.force() var force = d3.layout.force()
.nodes(d3.values(data.nodes)) .nodes(d3.values(data.nodes))
...@@ -336,6 +407,10 @@ define(['require', ...@@ -336,6 +407,10 @@ define(['require',
}) })
.on('click', function(d) { .on('click', function(d) {
if (d3.event.defaultPrevented) return; // ignore drag if (d3.event.defaultPrevented) return; // ignore drag
if (d && d.value && d.value.guid == that.guid) {
that.ui.boxClose.trigger('click');
return;
}
that.toggleBoxPanel({ el: that.$('.relationship-node-details') }); that.toggleBoxPanel({ el: that.$('.relationship-node-details') });
that.ui.searchNode.data({ obj: d }); that.ui.searchNode.data({ obj: d });
$(this).find('circle').addClass("node-detail-highlight"); $(this).find('circle').addClass("node-detail-highlight");
...@@ -370,12 +445,12 @@ define(['require', ...@@ -370,12 +445,12 @@ define(['require',
if (isAllEntityRelationDeleted({ data: d, type: 'node' })) { if (isAllEntityRelationDeleted({ data: d, type: 'node' })) {
return deletedEntityColor; return deletedEntityColor;
} else { } else {
return activeEntityColor; return selectedNodeColor;
} }
} else if (isAllEntityRelationDeleted({ data: d, type: 'node' })) { } else if (isAllEntityRelationDeleted({ data: d, type: 'node' })) {
return deletedEntityColor; return deletedEntityColor;
} else { } else {
return defaultEntityColor; return activeEntityColor;
} }
}) })
.attr("typename", function(d) { .attr("typename", function(d) {
...@@ -401,13 +476,7 @@ define(['require', ...@@ -401,13 +476,7 @@ define(['require',
} }
}) })
.attr("fill", function(d) { .attr("fill", function(d) {
if (d && d.value && d.value.guid == that.guid) { return "#fff";
return "#fff";
} else if (isAllEntityRelationDeleted({ data: d, type: 'node' })) {
return "#fff";
} else {
return "#000";
}
}); });
var countBox = circleContainer.append('g') var countBox = circleContainer.append('g')
countBox.append("circle") countBox.append("circle")
......
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