Skip to content

A
atlas
Commit 7b694adc by kevalbhatt Committed by Sarath Subramanian
Options

Summary:ATLAS-2579 : UI : Block Propagation at classification level in edit propagation flow.

Signed-off-by: 's avatarSarath Subramanian <ssubramanian@hortonworks.com>
parent 11c540d2
Showing with 89 additions and 75 deletions
dashboardv2/public/js/templates/graph/PropagationPropertyModalView_tmpl.html
...@@ -40,19 +40,31 @@ ...@@ -40,19 +40,31 @@
<li> <li>
<div class="radio"> <div class="radio">
<input type="radio" name="propagateRelation" value="ONE_TO_TWO" id="ONE_TO_TWO"> <input type="radio" name="propagateRelation" value="ONE_TO_TWO" id="ONE_TO_TWO">
<label class="padding-left-0" for="ONE_TO_TWO">ONE TO TWO</label> <label class="padding-left-0" for="ONE_TO_TWO">
<span class="fromName"></span>
<i class="fa-color fa fa-long-arrow-right"></i>
<span class="toName"></span>
</label>
</div> </div>
</li> </li>
<li> <li class="TWO_TO_ONE" style="display: none">
<div class="radio"> <div class="radio">
<input type="radio" name="propagateRelation" value="TWO_TO_ONE" id="TWO_TO_ONE"> <input type="radio" name="propagateRelation" value="TWO_TO_ONE" id="TWO_TO_ONE">
<label class="padding-left-0" for="TWO_TO_ONE">TWO TO ONE</label> <label class="padding-left-0" for="TWO_TO_ONE">
<span class="fromName"></span>
<i class="fa-color fa fa-long-arrow-left"></i>
<span class="toName"></span>
</label>
</div> </div>
</li> </li>
<li> <li class="both" style="display: none">
<div class="radio"> <div class="radio">
<input type="radio" name="propagateRelation" value="BOTH" id="BOTH"> <input type="radio" name="propagateRelation" value="BOTH" id="BOTH">
<label class="padding-left-0" for="BOTH">BOTH</label> <label class="padding-left-0" for="BOTH">
<span class="fromName"></span>
<i class="fa-color fa fa-arrows-h"></i>
<span class="toName"></span>
</label>
</div> </div>
</li> </li>
<li> <li>
......
dashboardv2/public/js/utils/UrlLinks.js
...@@ -91,7 +91,7 @@ define(['require', 'utils/Enums', 'utils/Utils', 'underscore'], function(require ...@@ -91,7 +91,7 @@ define(['require', 'utils/Enums', 'utils/Utils', 'underscore'], function(require
relationshipApiUrl: function(guid) { relationshipApiUrl: function(guid) {
var relationshipUrl = this.baseUrlV2 + '/relationship'; var relationshipUrl = this.baseUrlV2 + '/relationship';
if (guid) { if (guid) {
return relationshipUrl + '/guid/' + guid; return relationshipUrl + '/guid/' + guid + '?extendedInfo=true';
} else { } else {
return relationshipUrl return relationshipUrl
} }
......
dashboardv2/public/js/views/graph/PropagationPropertyModal.js
...@@ -35,7 +35,7 @@ define(['require', ...@@ -35,7 +35,7 @@ define(['require',
propagationOptions: '[data-id="propagationOptions"]', propagationOptions: '[data-id="propagationOptions"]',
edgeDetailName: '[data-id="edgeDetailName"]', edgeDetailName: '[data-id="edgeDetailName"]',
propagationState: "[data-id='propagationState']", propagationState: "[data-id='propagationState']",
classificationClick: "[data-id='classificationClick']", entityClick: "[data-id='entityClick']",
editPropagationType: 'input[name="editPropagationType"]', editPropagationType: 'input[name="editPropagationType"]',
PropagatedClassificationTable: "[data-id='PropagatedClassificationTable']" PropagatedClassificationTable: "[data-id='PropagatedClassificationTable']"
...@@ -62,7 +62,7 @@ define(['require', ...@@ -62,7 +62,7 @@ define(['require',
this.viewType = "flow"; this.viewType = "flow";
} }
}; };
events["click " + this.ui.classificationClick] = function(e) { events["click " + this.ui.entityClick] = function(e) {
var that = this, var that = this,
url = "", url = "",
notifyObj = { notifyObj = {
...@@ -78,18 +78,20 @@ define(['require', ...@@ -78,18 +78,20 @@ define(['require',
}, },
cancel: function(argument) {} cancel: function(argument) {}
}; },
if (e.currentTarget.dataset.entityguid) { $el = $(e.currentTarget),
url = '#!/tag/tagAttribute/' + e.currentTarget.dataset.entityguid; guid = $el.parents('tr').data('entityguid');
if ($el.hasClass('entityName')) {
url = '#!/detailPage/' + guid + '?tabActive=lineage';
} else { } else {
url = '#!/detailPage/' + e.currentTarget.dataset.guid + '?tabActive=lineage'; url = '#!/tag/tagAttribute/' + $el.data('name');
} }
Utils.notifyConfirm(notifyObj); Utils.notifyConfirm(notifyObj);
}; };
events["change " + this.ui.propagationState] = function(e) { events["change " + this.ui.propagationState] = function(e) {
this.modalEdited = true; this.modalEdited = true;
this.modal.$el.find('button.ok').attr("disabled", false); this.modal.$el.find('button.ok').attr("disabled", false);
var entityguid = e.currentTarget.dataset.entityguid; var entityguid = $(e.currentTarget).parents('tr').data("entityguid");
if (e.target.checked) { if (e.target.checked) {
this.propagatedClassifications = _.reject(this.propagatedClassifications, function(val, key) { this.propagatedClassifications = _.reject(this.propagatedClassifications, function(val, key) {
if (val.entityGuid == entityguid) { if (val.entityGuid == entityguid) {
...@@ -173,44 +175,53 @@ define(['require', ...@@ -173,44 +175,53 @@ define(['require',
id = options.id, id = options.id,
from = options.from, from = options.from,
to = options.to, to = options.to,
icon = { enableOtherFlow = function(relationshipObj) {
0: 'fa-long-arrow-right', var isTwoToOne = false;
1: 'fa-long-arrow-left', if (relationshipObj.propagateTags == "BOTH") {
2: 'fa-arrows-h' that.ui.propagationOptions.find('.both').show();
}; } else {
_.each(icon, function(value, key) { that.ui.propagationOptions.find('.both').hide();
that.ui.propagationOptions.find('li label')[key].innerHTML = from.typeName + ' <i class="fa-color fa ' + value + '"></i> ' + to.typeName; if (that.edgeInfo.obj.fromEntityId != relationshipObj.end1.guid && relationshipObj.propagateTags == "ONE_TO_TWO") {
}); isTwoToOne = true;
} else if (that.edgeInfo.obj.fromEntityId == relationshipObj.end1.guid && relationshipObj.propagateTags == "TWO_TO_ONE") {
isTwoToOne = true;
}
if (isTwoToOne) {
that.ui.propagationOptions.find('.TWO_TO_ONE').show();
} else {
that.ui.propagationOptions.find('.TWO_TO_ONE').hide();
}
}
},
updateValue = function(relationshipData) {
var relationshipObj = relationshipData.relationship;
if (relationshipObj) {
that.$("input[name='propagateRelation'][value=" + that.getPropagationFlow({
"relationshipData": relationshipObj,
"graphData": options
}) + "]").prop('checked', true);
enableOtherFlow(relationshipObj);
that.showBlockedClassificationTable(relationshipData);
that.hideLoader({ buttonDisabled: true });
}
}
this.ui.propagationOptions.find('li label>span.fromName').text(from.typeName);
this.ui.propagationOptions.find('li label>span.toName').text(to.typeName);
if (id === this.ui.propagationOptions.attr("entity-id")) { if (id === this.ui.propagationOptions.attr("entity-id")) {
return; return;
} }
this.ui.propagationOptions.attr("entity-id", id); this.ui.propagationOptions.attr("entity-id", id);
if (this.apiGuid[id]) { if (this.apiGuid[id]) {
this.hideLoader(); updateValue(this.apiGuid[id]);
this.$("input[name='propagateRelation']").removeAttr('checked');
this.$("input[name='propagateRelation'][value=" + that.getPropagationFlow({
"relationshipData": this.apiGuid[id],
"graphData": options
}) + "]").prop('checked', true);
this.showBlockedClassificationTable(this.apiGuid[id]);
this.getEntityNameForClassification(this.apiGuid[id]);
} else { } else {
if (this.edgeCall && this.edgeCall.readyState != 4) { if (this.edgeCall && this.edgeCall.readyState != 4) {
this.edgeCall.abort(); this.edgeCall.abort();
} }
this.edgeCall = this.entityModel.getRelationship(id, { this.edgeCall = this.entityModel.getRelationship(id, {
success: function(relationshipData) { success: function(relationshipData) {
if (relationshipData) { that.apiGuid[relationshipData.relationship.guid] = relationshipData;
that.apiGuid[relationshipData.guid] = relationshipData; updateValue(relationshipData);
that.$("input[name='propagateRelation']").removeAttr('checked');
that.$("input[name='propagateRelation'][value=" + that.getPropagationFlow({
"relationshipData": relationshipData,
"graphData": options
}) + "]").prop('checked', true);
that.showBlockedClassificationTable(relationshipData);
that.getEntityNameForClassification(relationshipData);
that.hideLoader({ buttonDisabled: true });
}
}, },
cust_error: function() { cust_error: function() {
that.hideLoader(); that.hideLoader();
...@@ -230,23 +241,23 @@ define(['require', ...@@ -230,23 +241,23 @@ define(['require',
if (this.viewType == "flow") { if (this.viewType == "flow") {
relationshipProp = { relationshipProp = {
"propagateTags": that.getPropagationFlow({ "propagateTags": that.getPropagationFlow({
"relationshipData": _.extend(that.apiGuid[entityId], { 'propagateTags': PropagationValue }), "relationshipData": _.extend({}, this.apiGuid[entityId].relationship, { 'propagateTags': PropagationValue }),
"graphData": { from: { guid: this.edgeInfo.obj.fromEntityId } } "graphData": { from: { guid: this.edgeInfo.obj.fromEntityId } }
}) })
} }
} else { } else {
relationshipProp = { relationshipProp = {
"blockedPropagatedClassifications": _.uniq(that.blockedPropagatedClassifications, function(val, key) { "blockedPropagatedClassifications": _.uniq(this.blockedPropagatedClassifications, function(val, key) {
return val.entityGuid; return val.entityGuid;
}), }),
"propagatedClassifications": _.uniq(that.propagatedClassifications, function(val, key) { "propagatedClassifications": _.uniq(this.propagatedClassifications, function(val, key) {
return val.entityGuid; return val.entityGuid;
}) })
}; };
} }
this.showLoader(); this.showLoader();
this.entityModel.saveRelationship({ this.entityModel.saveRelationship({
data: JSON.stringify(_.extend(that.apiGuid[entityId], relationshipProp)), data: JSON.stringify(_.extend({}, that.apiGuid[entityId].relationship, relationshipProp)),
success: function(relationshipData) { success: function(relationshipData) {
if (relationshipData) { if (relationshipData) {
that.hideLoader({ buttonDisabled: true }); that.hideLoader({ buttonDisabled: true });
...@@ -266,45 +277,36 @@ define(['require', ...@@ -266,45 +277,36 @@ define(['require',
showBlockedClassificationTable: function(options) { showBlockedClassificationTable: function(options) {
var that = this, var that = this,
propagationStringValue = "", propagationStringValue = "",
classificationTableValue = ""; classificationTableValue = "",
this.blockedPropagatedClassifications = _.isUndefined(options.blockedPropagatedClassifications) ? [] : options.blockedPropagatedClassifications; relationship = options.relationship,
this.propagatedClassifications = _.isUndefined(options.propagatedClassifications) ? [] : options.propagatedClassifications; referredEntities = options.referredEntities,
getEntityName = function(guid) {
var entityObj = referredEntities[guid],
name = guid;
if (entityObj) {
name = Utils.getName(entityObj) + " (" + entityObj.typeName + ")";
}
return "<a class='entityName' data-id='entityClick'>" + name + "</a>";
},
getTableRow = function(options) {
var val = options.val,
fromBlockClassification = options.fromBlockClassification;
return "<tr data-entityguid=" + val.entityGuid + "><td class='text-center w30'><a class='classificationName' data-id='entityClick' title='" + val.typeName + "' data-name='" + val.typeName + "''>" + val.typeName + "</a></td><td class='text-center'>" + getEntityName(val.entityGuid) + "</td><td class='text-center w30'><input type='checkbox' " + (fromBlockClassification ? "checked" : "") + " data-id='propagationState' class='input'></td></tr>";
};
this.blockedPropagatedClassifications = _.isUndefined(relationship.blockedPropagatedClassifications) ? [] : _.clone(relationship.blockedPropagatedClassifications);
this.propagatedClassifications = _.isUndefined(relationship.propagatedClassifications) ? [] : _.clone(relationship.propagatedClassifications);
_.each(this.blockedPropagatedClassifications, function(val, key) { _.each(this.blockedPropagatedClassifications, function(val, key) {
propagationStringValue += "<tr><td class='html-cell string-cell renderable text-center w30'><a data-id='classificationClick' title='' data-entityGuid=" + val.entityGuid + ">" + val.typeName + "</a></td><td class='html-cell string-cell renderable text-center' data-tr-entityGuid=" + val.entityGuid + "></td><td class='html-cell string-cell renderable text-center w30'><input type='checkbox' checked data-id='propagationState' data-entityGuid=" + val.entityGuid + " class='input'></td></tr>"; propagationStringValue += getTableRow({ "val": val, fromBlockClassification: true });
}); });
_.each(this.propagatedClassifications, function(val, key) { _.each(this.propagatedClassifications, function(val, key) {
propagationStringValue += "<tr><td class='html-cell string-cell renderable text-center w30'><a data-id='classificationClick' title='' data-entityGuid=" + val.entityGuid + ">" + val.typeName + "</a></td><td class='html-cell string-cell renderable text-center' data-tr-entityGuid=" + val.entityGuid + "></td><td class='html-cell string-cell renderable text-center w30'><input type='checkbox' data-id='propagationState' data-entityGuid=" + val.entityGuid + " class='input'></td></tr>"; propagationStringValue += getTableRow({ "val": val, fromBlockClassification: false });
}); });
classificationTableValue = "<table class='attriTable'><caption>Block Propagatation Table</caption><tr><th class='html-cell string-cell renderable w30'>Classification</th><th class='html-cell string-cell renderable'>Entity Name</th><th class='html-cell string-cell renderable w30'>Block Propagatation</th>" + propagationStringValue + "</table>"; classificationTableValue = "<table class='attriTable'><caption>Block Propagatation Table</caption><tr><th class='w30'>Classification</th><th>Entity Name</th><th class='w30'>Block Propagatation</th>" + propagationStringValue + "</table>";
this.ui.PropagatedClassificationTable.append(_.isEmpty(propagationStringValue) ? "No Records Found." : classificationTableValue); this.ui.PropagatedClassificationTable.append(_.isEmpty(propagationStringValue) ? "No Records Found." : classificationTableValue);
}, },
getEntityNameForClassification: function(options) {
var that = this,
allEntityGuid = _.pluck(_.union(options.blockedPropagatedClassifications, options.propagatedClassifications, function(val, key) {
return val.entityGuid;
}), 'entityGuid'),
apiCall = allEntityGuid.length;
_.map(allEntityGuid, function(entityGuid, key) {
that.VEntityModel.getEntity(entityGuid, {
success: function(data) {
var entityNameWithType = Utils.getName(data['entity']) + ' ( ' + data['entity'].typeName + ' )',
link = "<a data-id='classificationClick' title='' data-guid=" + data['entity'].guid + ">" + entityNameWithType + "</a>";
that.ui.PropagatedClassificationTable.find('[data-tr-entityGuid=' + entityGuid + ']').html(link);
},
complete: function() {
apiCall -= 1;
if (apiCall == 0) {
that.hideLoader({ buttonDisabled: true });
}
},
cust_error: function() {
that.hideLoader({ buttonDisabled: true });
}
});
});
},
showLoader: function() { showLoader: function() {
this.modal.$el.find('button.ok').attr("disabled", true); this.modal.$el.find('button.ok').attr("disabled", true);
this.$('.overlay').removeClass('hide').addClass('show'); this.$('.overlay').removeClass('hide').addClass('show');
......
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