Skip to content

A
atlas
Commit e8a73821 by kevalbhatt Committed by Madhan Neethiraj
Options

ATLAS-1750: type ahead for entity input in create/update entity UI

Signed-off-by: 's avatarMadhan Neethiraj <madhan@apache.org>
parent c3b1bcb1
Showing with 303 additions and 323 deletions
dashboardv2/public/css/scss/tag.scss
...@@ -142,8 +142,8 @@ ...@@ -142,8 +142,8 @@
.inputTagAdd { .inputTagAdd {
display: inline-block; display: inline-block;
border: 1px #4A90E2 solid; border: 1px $color_havelock_blue_approx solid;
color: #4A90E2; color: $color_havelock_blue_approx;
font-size: 14px; font-size: 14px;
border-radius: 4px; border-radius: 4px;
margin-right: 3px; margin-right: 3px;
...@@ -376,35 +376,21 @@ legend.scheduler-border { ...@@ -376,35 +376,21 @@ legend.scheduler-border {
} }
.spanEntityType { .spanEntityType {
position: absolute;
right: 45px;
top: 10px;
cursor: help; cursor: help;
width: 40px; width: 100%;
display: block;
white-space: nowrap;
overflow: hidden; overflow: hidden;
z-index: 9;
text-overflow: ellipsis; text-overflow: ellipsis;
font-size: 14px; font-size: 14px;
color: #a7a19f; color: #a7a19f;
} }
.enitityInputBox {
padding-right: 69px;
}
.entityLoader {
margin-left: 286px;
}
.errorClass { .errorClass {
border: 1px solid red !important; border: 1px solid red !important;
box-shadow: none !important; box-shadow: none !important;
} }
.entityInputBox {
padding-right: 70px;
}
.attributeTag { .attributeTag {
padding: 5px 8px; padding: 5px 8px;
border: 1px solid #999999; border: 1px solid #999999;
......
dashboardv2/public/js/modules/Modal.js
...@@ -84,7 +84,8 @@ define(['require', 'backbone', 'hbs!tmpl/common/modal'], function(require, Backb ...@@ -84,7 +84,8 @@ define(['require', 'backbone', 'hbs!tmpl/common/modal'], function(require, Backb
escape: true, escape: true,
animate: true, animate: true,
contentWithFooter: false, contentWithFooter: false,
template: template template: template,
width: null
}, options); }, options);
}, },
......
dashboardv2/public/js/templates/common/modal.html
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
* 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.
--> -->
<div class="modal-dialog {{mainClass}}" role="document"> <div class="modal-dialog {{mainClass}} " style="width:{{width}}" role="document">
<div class="modal-content"> <div class="modal-content">
{{#if title}} {{#if title}}
<div class="modal-header"> <div class="modal-header">
......
dashboardv2/public/js/templates/entity/CreateEntityLayoutView_tmpl.html
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
* limitations under the License. * limitations under the License.
--> -->
<form name="entityDefinitionform" class="css-form"> <form name="entityDefinitionform" class="css-form">
<div class="form-group"> <div class="form-group clearfix">
<div class="col-sm-12"> <div class="col-sm-12">
<div class="row"> <div class="row">
{{#if guid}} {{#if guid}}
...@@ -37,9 +37,11 @@ ...@@ -37,9 +37,11 @@
</div> </div>
</div> </div>
</div> </div>
<div class="entityLoader" style="display:none">
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
<div class="control-group entityInputData" data-id="entityInputData"></div> <div class="control-group entityInputData" data-id="entityInputData"></div>
</div> </div>
</form> </form>
<div class="" style="position: relative;height: 8px;">
<div class="fontLoader entityLoader" style="display:none">
<i class="fa fa-refresh fa-spin-custom"></i>
</div>
</div>
dashboardv2/public/js/utils/Utils.js
...@@ -349,42 +349,76 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'pnotify.button ...@@ -349,42 +349,76 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'pnotify.button
} }
} }
} }
Utils.getName = function(collectionJSON, priorityAttribute) { Utils.getName = function() {
return Utils.extractKeyValueFromEntity.apply(this, arguments).name;
}
Utils.getNameWithProperties = function() {
return Utils.extractKeyValueFromEntity.apply(this, arguments);
}
Utils.extractKeyValueFromEntity = function() {
var collectionJSON = arguments[0],
priorityAttribute = arguments[1];
var returnObj = {
name: '-',
found: true,
key: null
}
if (collectionJSON) { if (collectionJSON) {
if (collectionJSON.attributes && collectionJSON.attributes[priorityAttribute]) { if (collectionJSON.attributes && collectionJSON.attributes[priorityAttribute]) {
return _.escape(collectionJSON.attributes[priorityAttribute]); returnObj.name = _.escape(collectionJSON.attributes[priorityAttribute]);
returnObj.key = priorityAttribute;
return returnObj;
} }
if (collectionJSON[priorityAttribute]) { if (collectionJSON[priorityAttribute]) {
return _.escape(collectionJSON[priorityAttribute]); returnObj.name = _.escape(collectionJSON[priorityAttribute]);
returnObj.key = priorityAttribute;
return returnObj;
} }
if (collectionJSON.attributes) { if (collectionJSON.attributes) {
if (collectionJSON.attributes.name) { if (collectionJSON.attributes.name) {
return _.escape(collectionJSON.attributes.name); returnObj.name = _.escape(collectionJSON.attributes.name);
returnObj.key = 'name';
return returnObj;
} }
if (collectionJSON.attributes.qualifiedName) { if (collectionJSON.attributes.qualifiedName) {
return _.escape(collectionJSON.attributes.qualifiedName); returnObj.name = _.escape(collectionJSON.attributes.qualifiedName);
returnObj.key = 'qualifiedName';
return returnObj;
} }
if (collectionJSON.attributes.id) { if (collectionJSON.attributes.id) {
return _.escape(collectionJSON.attributes.id); returnObj.name = _.escape(collectionJSON.attributes.id);
returnObj.key = 'id';
return returnObj;
} }
} }
if (collectionJSON.name) { if (collectionJSON.name) {
return _.escape(collectionJSON.name); returnObj.name = _.escape(collectionJSON.name);
returnObj.key = 'name';
return returnObj;
} }
if (collectionJSON.qualifiedName) { if (collectionJSON.qualifiedName) {
return _.escape(collectionJSON.qualifiedName); returnObj.name = _.escape(collectionJSON.qualifiedName);
returnObj.key = 'qualifiedName';
return returnObj;
} }
if (collectionJSON.displayText) { if (collectionJSON.displayText) {
return _.escape(collectionJSON.displayText); returnObj.name = _.escape(collectionJSON.displayText);
returnObj.key = 'displayText';
return returnObj;
} }
if (collectionJSON.guid) { if (collectionJSON.guid) {
return _.escape(collectionJSON.guid); returnObj.name = _.escape(collectionJSON.guid);
returnObj.key = 'guid';
return returnObj;
} }
if (collectionJSON.id) { if (collectionJSON.id) {
return _.escape(collectionJSON.id); returnObj.name = _.escape(collectionJSON.id);
returnObj.key = 'id';
return returnObj;
} }
} }
return "-"; returnObj.found = false;
return returnObj;
} }
Utils.showTitleLoader = function(loaderEl, titleBoxEl) { Utils.showTitleLoader = function(loaderEl, titleBoxEl) {
loaderEl.css({ loaderEl.css({
...@@ -401,7 +435,44 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'pnotify.button ...@@ -401,7 +435,44 @@ define(['require', 'utils/Globals', 'pnotify', 'utils/Messages', 'pnotify.button
loaderEl.hide(); loaderEl.hide();
titleBoxEl.fadeIn(); titleBoxEl.fadeIn();
} }
Utils.getNestedSuperTypeObj = function(options) {
var flag = 0,
data = options.data,
collection = options.collection;
if (options.attrMerge) {
var attributeDefs = [];
} else {
var attributeDefs = {};
}
var getData = function(data, collection) {
if (options.attrMerge) {
attributeDefs = attributeDefs.concat(data.attributeDefs);
} else {
if (attributeDefs[data.name]) {
if (_.isArray(attributeDefs[data.name])) {
attributeDefs[data.name] = attributeDefs[data.name].concat(data.attributeDefs);
} else {
_.extend(attributeDefs[data.name], data.attributeDefs);
}
} else {
attributeDefs[data.name] = data.attributeDefs;
}
}
if (data.superTypes && data.superTypes.length) {
_.each(data.superTypes, function(superTypeName) {
if (collection.fullCollection) {
var collectionData = collection.fullCollection.findWhere({ name: superTypeName }).toJSON();
} else {
var collectionData = collection.findWhere({ name: superTypeName }).toJSON();
}
return getData(collectionData, collection);
});
}
}
getData(data, collection);
return attributeDefs
}
$.fn.toggleAttribute = function(attributeName, firstString, secondString) { $.fn.toggleAttribute = function(attributeName, firstString, secondString) {
if (this.attr(attributeName) == firstString) { if (this.attr(attributeName) == firstString) {
this.attr(attributeName, secondString); this.attr(attributeName, secondString);
......
dashboardv2/public/js/views/entity/CreateEntityLayoutView.js
...@@ -75,17 +75,13 @@ define(['require', ...@@ -75,17 +75,13 @@ define(['require',
_.extend(this, _.pick(options, 'guid', 'callback', 'showLoader', 'entityDefCollection', 'typeHeaders')); _.extend(this, _.pick(options, 'guid', 'callback', 'showLoader', 'entityDefCollection', 'typeHeaders'));
var that = this, var that = this,
entityTitle, okLabel; entityTitle, okLabel;
this.searchCollection = new VSearchList();
this.searchCollection.url = UrlLinks.searchApiUrl(Enums.searchUrlType.DSL);
this.selectStoreCollection = new Backbone.Collection(); this.selectStoreCollection = new Backbone.Collection();
this.collection = new VEntityList(); this.collection = new VEntityList();
this.entityModel = new VEntity(); this.entityModel = new VEntity();
if (this.guid) { if (this.guid) {
this.collection.modelAttrName = "createEntity" this.collection.modelAttrName = "createEntity"
} }
this.searchQueryList = []; this.asyncReferEntityCounter = 0;
this.asyncFetchCounter = 0;
this.asyncFetchLOVCounter = 0;
this.required = true; this.required = true;
if (this.guid) { if (this.guid) {
entityTitle = 'Edit entity'; entityTitle = 'Edit entity';
...@@ -101,16 +97,7 @@ define(['require', ...@@ -101,16 +97,7 @@ define(['require',
okText: okLabel, okText: okLabel,
allowCancel: true, allowCancel: true,
okCloses: false, okCloses: false,
resizable: true, width: '70%'
resizableOpts: {
minWidth: 600,
minHeight: 284,
handles: "n, e, s, w",
resize: function(event, ui) {
that.modal.$el.find('.modal-body').css('min-height', ui.size.height - 134 + 'px');
that.modal.$el.find('.modal-body').css('max-height', ui.size.height - 134 + 'px');
}
}
}).open(); }).open();
this.modal.$el.find('button.ok').attr("disabled", true); this.modal.$el.find('button.ok').attr("disabled", true);
this.modal.on('ok', function(e) { this.modal.on('ok', function(e) {
...@@ -123,30 +110,10 @@ define(['require', ...@@ -123,30 +110,10 @@ define(['require',
bindEvents: function() { bindEvents: function() {
var that = this; var that = this;
this.listenTo(this.collection, "reset", function() { this.listenTo(this.collection, "reset", function() {
this.decrementCounter('asyncFetchCounter');
this.entityCollectionList(); this.entityCollectionList();
}, this); }, this);
this.listenTo(this.collection, 'error', function() { this.listenTo(this.collection, 'error', function() {
this.decrementCounter('asyncFetchCounter'); this.hideLoader();
if (this.asyncFetchCounter === 0) {
this.hideLoader();
}
}, this);
this.listenTo(this.searchCollection, "reset", function() {
var that = this;
this.decrementCounter('asyncFetchLOVCounter');
_.each(this.searchCollection.fullCollection.models, function(model) {
var obj = model.toJSON();
if (that.searchCollection && that.searchCollection.queryText) {
obj['queryText'] = that.searchCollection.queryText;
}
that.selectStoreCollection.push(obj);
})
this.addJsonSearchData();
}, this);
this.listenTo(this.searchCollection, 'error', function(data, key) {
this.decrementCounter('asyncFetchLOVCounter');
this.addJsonSearchData();
}, this); }, this);
this.ui.entityInputData.on("keyup change", "textarea", function(e) { this.ui.entityInputData.on("keyup change", "textarea", function(e) {
var value = this.value; var value = this.value;
...@@ -193,6 +160,7 @@ define(['require', ...@@ -193,6 +160,7 @@ define(['require',
}, },
onRender: function() { onRender: function() {
this.bindEvents(); this.bindEvents();
this.showLoader();
this.fetchCollections(); this.fetchCollections();
}, },
bindNonRequiredField: function() { bindNonRequiredField: function() {
...@@ -227,7 +195,37 @@ define(['require', ...@@ -227,7 +195,37 @@ define(['require',
that.entityData = val; that.entityData = val;
}); });
this.ui.assetName.html(name); this.ui.assetName.html(name);
this.onEntityChange(null, this.entityData); var referredEntities = this.entityData.get('referredEntities');
var attributes = this.entityData.get('entity').attributes;
_.map(_.keys(attributes), function(key) {
if (_.isObject(attributes[key])) {
var attrObj = attributes[key];
if (_.isObject(attrObj) && !_.isArray(attrObj)) {
attrObj = [attrObj];
}
_.each(attrObj, function(obj) {
if (obj.guid && !referredEntities[obj.guid]) {
++that.asyncReferEntityCounter;
that.collection.url = UrlLinks.entitiesApiUrl(obj.guid);
that.collection.fetch({
success: function(data, response) {
referredEntities[obj.guid] = response.entity;
},
complete: function() {
that.decrementCounter('asyncReferEntityCounter');
if (that.asyncReferEntityCounter === 0) {
that.onEntityChange(null, that.entityData);
}
},
silent: true
});
}
});
}
});
if (this.asyncReferEntityCounter === 0) {
this.onEntityChange(null, this.entityData);
}
} else { } else {
var str = '<option disabled="disabled" selected>--Select entity-type--</option>'; var str = '<option disabled="disabled" selected>--Select entity-type--</option>';
this.entityDefCollection.fullCollection.comparator = function(model) { this.entityDefCollection.fullCollection.comparator = function(model) {
...@@ -247,6 +245,7 @@ define(['require', ...@@ -247,6 +245,7 @@ define(['require',
}); });
this.ui.entityList.html(str); this.ui.entityList.html(str);
this.ui.entityList.select2({}); this.ui.entityList.select2({});
this.hideLoader();
} }
}, },
capitalize: function(string) { capitalize: function(string) {
...@@ -273,7 +272,9 @@ define(['require', ...@@ -273,7 +272,9 @@ define(['require',
onEntityChange: function(e, value) { onEntityChange: function(e, value) {
var that = this, var that = this,
typeName = value && value.get('entity') ? value.get('entity').typeName : null; typeName = value && value.get('entity') ? value.get('entity').typeName : null;
this.showLoader(); if (!this.guid) {
this.showLoader();
}
this.ui.entityInputData.empty(); this.ui.entityInputData.empty();
if (typeName) { if (typeName) {
this.collection.url = UrlLinks.entitiesDefApiUrl(typeName); this.collection.url = UrlLinks.entitiesDefApiUrl(typeName);
...@@ -283,10 +284,11 @@ define(['require', ...@@ -283,10 +284,11 @@ define(['require',
} }
this.collection.fetch({ this.collection.fetch({
success: function(model, data) { success: function(model, data) {
that.supuertypeFlag = 0;
that.subAttributeData(data) that.subAttributeData(data)
}, },
complete: function() { complete: function() {
that.initilizeElements(); //that.initilizeElements();
}, },
silent: true silent: true
}); });
...@@ -294,24 +296,23 @@ define(['require', ...@@ -294,24 +296,23 @@ define(['require',
subAttributeData: function(data) { subAttributeData: function(data) {
var that = this, var that = this,
attributeInput = "", attributeInput = "",
alloptional = false; alloptional = false,
_.each(data.attributeDefs, function(value) { attributeDefs = Utils.getNestedSuperTypeObj({ data: data, collection: this.entityDefCollection });
if (value.isOptional == true) { _.each(_.sortBy(_.keys(attributeDefs)), function(key) {
alloptional = true; if (attributeDefs[key].length) {
attributeInput = "";
_.each(_.sortBy(attributeDefs[key], 'name'), function(value) {
if (value.isOptional == true) {
alloptional = true;
}
attributeInput += that.getContainer(value);
});
if (attributeInput !== "") {
entityTitle = that.getFieldSet(key, alloptional, attributeInput);
that.ui.entityInputData.append(entityTitle);
}
} }
attributeInput += that.getContainer(value);
}); });
if (attributeInput !== "") {
entityTitle = that.getFieldSet(data, alloptional, attributeInput);
that.ui.entityInputData.prepend(entityTitle);
}
if (data.superTypes && data.superTypes.length > 0) {
for (var j = 0; j < data.superTypes.length; j++) {
var superTypeAttr = data.superTypes[j];
that.fetchTagSubData(superTypeAttr);
}
}
if (this.required) { if (this.required) {
this.ui.entityInputData.find('fieldset div.true').hide() this.ui.entityInputData.find('fieldset div.true').hide()
this.ui.entityInputData.find('div.true').hide(); this.ui.entityInputData.find('div.true').hide();
...@@ -319,68 +320,45 @@ define(['require', ...@@ -319,68 +320,45 @@ define(['require',
if (!('placeholder' in HTMLInputElement.prototype)) { if (!('placeholder' in HTMLInputElement.prototype)) {
this.ui.entityInputData.find("input,select,textarea").placeholder(); this.ui.entityInputData.find("input,select,textarea").placeholder();
} }
}, that.initilizeElements();
fetchTagSubData: function(entityName) {
var that = this;
this.collection.url = UrlLinks.entitiesDefApiUrl(entityName);
this.collection.modelAttrName = 'attributeDefs';
++this.asyncFetchCounter;
this.collection.fetch({
success: function(model, data) {
that.subAttributeData(data);
},
complete: function() {
that.decrementCounter('asyncFetchCounter');
that.initilizeElements();
},
silent: true
});
}, },
initilizeElements: function() { initilizeElements: function() {
var that = this; var that = this;
if (this.asyncFetchCounter === 0) { this.$('input[data-type="date"]').each(function() {
this.$('input[data-type="date"]').each(function() { if (!$(this).data('datepicker')) {
if (!$(this).data('datepicker')) { $(this).datetimepicker({
$(this).datetimepicker({ format: 'DD MMMM YYYY',
format: 'DD MMMM YYYY', keepInvalid: true
keepInvalid: true
});
}
});
if (this.guid) {
this.bindNonRequiredField();
}
this.initializeValidation();
if (this.ui.entityInputData.find('fieldset').length > 0 && this.ui.entityInputData.find('select.true,input.true').length === 0) {
this.requiredAllToggle(this.ui.entityInputData.find('select.true,input.true').length === 0);
if (!this.guid) {
// For create entity bind keyup for non-required field when all elements are optional
this.bindNonRequiredField();
}
this.ui.toggleRequired.prop('checked', true);
} else {
this.ui.entityInputData.find('fieldset').each(function() {
// if checkbox is alredy selected then dont hide
if (!$(this).find('div').hasClass('false') && !that.ui.toggleRequired.is(":checked")) {
$(this).hide();
}
}); });
} }
this.$('select[data-type="boolean"]').each(function(value, key) { });
var dataKey = $(key).data('key'); if (this.guid) {
if (that.entityData) { this.bindNonRequiredField();
var setValue = that.entityData.get("entity").attributes[dataKey]; }
this.value = setValue; this.initializeValidation();
if (this.ui.entityInputData.find('fieldset').length > 0 && this.ui.entityInputData.find('select.true,input.true').length === 0) {
this.requiredAllToggle(this.ui.entityInputData.find('select.true,input.true').length === 0);
if (!this.guid) {
// For create entity bind keyup for non-required field when all elements are optional
this.bindNonRequiredField();
}
this.ui.toggleRequired.prop('checked', true);
} else {
this.ui.entityInputData.find('fieldset').each(function() {
// if checkbox is alredy selected then dont hide
if (!$(this).find('div').hasClass('false') && !that.ui.toggleRequired.is(":checked")) {
$(this).hide();
} }
}); });
if (this.ui.entityInputData.find('select').length) {
this.ui.entityInputData.find('select').each(function() {
that.addJsonSearchData();
});
} else {
this.hideLoader();
}
} }
this.$('select[data-type="boolean"]').each(function(value, key) {
var dataKey = $(key).data('key');
if (that.entityData) {
var setValue = that.entityData.get("entity").attributes[dataKey];
this.value = setValue;
}
});
this.addJsonSearchData();
}, },
initializeValidation: function() { initializeValidation: function() {
// IE9 allow input type number // IE9 allow input type number
...@@ -419,14 +397,14 @@ define(['require', ...@@ -419,14 +397,14 @@ define(['require',
getContainer: function(value) { getContainer: function(value) {
var entityLabel = this.capitalize(value.name); var entityLabel = this.capitalize(value.name);
return '<div class="row row-margin-bottom ' + value.isOptional + '"><span class="col-md-3">' + return '<div class="row row-margin-bottom ' + value.isOptional + '"><span class="col-md-3">' +
'<label class="' + value.isOptional + '">' + entityLabel + (value.isOptional == true ? '' : ' <span class="requiredInput">*</span>') + '</label></span>' + '<label class="' + value.isOptional + '">' + entityLabel + (value.isOptional == true ? '' : ' <span class="requiredInput">*</span>') + '</label>' + '<span class="spanEntityType" title="Data Type : ' + value.typeName + '">' + '(' + Utils.escapeHtml(value.typeName) + ')' + '</span>' + '</span>' +
'<span class="col-md-9 position-relative">' + (this.getElement(value)) + '<span class="col-md-9 position-relative">' + (this.getElement(value)) +
'<span class="spanEntityType" title="Data Type : ' + value.typeName + '">' + '(' + Utils.escapeHtml(value.typeName) + ')' + '</span></input></span></div>'; '</input></span></div>';
}, },
getFieldSet: function(data, alloptional, attributeInput) { getFieldSet: function(name, alloptional, attributeInput) {
return '<fieldset class="scheduler-border' + (alloptional ? " alloptional" : "") + '"><legend class="scheduler-border">' + data.name + '</legend>' + attributeInput + '</fieldset>'; return '<fieldset class="scheduler-border' + (alloptional ? " alloptional" : "") + '"><legend class="scheduler-border">' + name + '</legend>' + attributeInput + '</fieldset>';
}, },
getSelect: function(value, entityValue, disabled) { getSelect: function(value, entityValue) {
if (value.typeName === "boolean") { if (value.typeName === "boolean") {
return '<select class="form-control row-margin-bottom ' + (value.isOptional === true ? "false" : "true") + '" data-type="' + value.typeName + '" data-key="' + value.name + '" data-id="entityInput">' + return '<select class="form-control row-margin-bottom ' + (value.isOptional === true ? "false" : "true") + '" data-type="' + value.typeName + '" data-key="' + value.name + '" data-id="entityInput">' +
'<option value="">--Select true or false--</option><option value="true">true</option>' + '<option value="">--Select true or false--</option><option value="true">true</option>' +
...@@ -438,11 +416,8 @@ define(['require', ...@@ -438,11 +416,8 @@ define(['require',
} else { } else {
splitTypeName = value.typeName; splitTypeName = value.typeName;
} }
if (!this.guid) {
disabled = value.isOptional;
}
return '<select class="form-control row-margin-bottom entityInputBox ' + (value.isOptional === true ? "false" : "true") + '" data-type="' + value.typeName + return '<select class="form-control row-margin-bottom entityInputBox ' + (value.isOptional === true ? "false" : "true") + '" data-type="' + value.typeName +
'" data-key="' + value.name + '" ' + (disabled ? 'disabled data-skip="true"' : "") + ' data-id="entitySelectData" data-queryData="' + splitTypeName + '">' + (this.guid ? entityValue : "") + '</select>'; '" data-key="' + value.name + '" data-id="entitySelectData" data-queryData="' + splitTypeName + '">' + (this.guid ? entityValue : "") + '</select>';
} }
}, },
...@@ -488,29 +463,8 @@ define(['require', ...@@ -488,29 +463,8 @@ define(['require',
} }
} }
} }
if (typeName && this.entityDefCollection.fullCollection.find({ name: typeName })) { if ((typeName && this.entityDefCollection.fullCollection.find({ name: typeName })) || typeName === "boolean" || typeName.indexOf("array") > -1) {
if (!_.contains(this.searchQueryList, typeName)) {
this.searchQueryList.push(typeName);
$.extend(this.searchCollection.queryParams, { query: typeName });
++this.asyncFetchLOVCounter;
this.searchCollection.fetch({ reset: true });
}
return this.getSelect(value, entityValue); return this.getSelect(value, entityValue);
} else if (typeName === "boolean" || typeName.indexOf("array") > -1) {
var splitTypeName = typeName.split("<");
if (splitTypeName.length > 1) {
splitTypeName = splitTypeName[1].split(">")[0];
if (splitTypeName && this.entityDefCollection.fullCollection.find({ name: splitTypeName })) {
if (!_.contains(this.searchQueryList, splitTypeName) && !value.isOptional) {
this.searchQueryList.push(splitTypeName);
$.extend(this.searchCollection.queryParams, { query: splitTypeName });
++this.asyncFetchLOVCounter;
this.searchCollection.fetch({ reset: true });
}
return this.getSelect(value, entityValue, true);
}
}
return this.getSelect(value, entityValue, false); // Don't disable select for non entity attributes.
} else if (typeName.indexOf("map") > -1) { } else if (typeName.indexOf("map") > -1) {
return this.getTextArea(value, entityValue); return this.getTextArea(value, entityValue);
} else { } else {
...@@ -528,46 +482,22 @@ define(['require', ...@@ -528,46 +482,22 @@ define(['require',
this.parentEntity = this.ui.entityList.val(); this.parentEntity = this.ui.entityList.val();
var entity = {}; var entity = {};
var referredEntities = {}; var referredEntities = {};
var extractValue = function(value) { var extractValue = function(value, typeName) {
if (!value) { if (!value) {
return value; return value;
} }
if (_.isArray(value)) { if (_.isArray(value)) {
if (that.selectStoreCollection.length) { var parseData = [];
var parseData = []; _.map(value, function(val) {
value.map(function(val) { parseData.push({ 'guid': val, 'typeName': typeName });
var temp = {} // I9 support; });
temp['labelName'] = val;
if (that.selectStoreCollection.findWhere(temp)) {
var valueData = that.selectStoreCollection.findWhere(temp).toJSON();
if (valueData) {
//referredEntities[valueData.guid] = valueData;
parseData.push({ guid: valueData.guid, typeName: valueData.typeName });
}
}
});
}
} else { } else {
if (that.selectStoreCollection.length) { var parseData = { 'guid': value, 'typeName': typeName };
var temp = {} // I9 support;
temp['labelName'] = value;
if (that.selectStoreCollection.findWhere(temp)) {
var valueData = that.selectStoreCollection.findWhere(temp).toJSON();
if (valueData) {
//referredEntities[valueData.guid] = valueData;
var parseData = { guid: valueData.guid, typeName: valueData.typeName };
}
}
}
} }
return parseData; return parseData;
} }
try { try {
this.ui.entityInputData.find("input,select,textarea").each(function() { this.ui.entityInputData.find("input,select,textarea").each(function() {
if ($(this).data('skip') === true) {
return;
}
var value = $(this).val(); var value = $(this).val();
if ($(this).val() && $(this).val().trim) { if ($(this).val() && $(this).val().trim) {
value = $(this).val().trim(); value = $(this).val().trim();
...@@ -596,14 +526,15 @@ define(['require', ...@@ -596,14 +526,15 @@ define(['require',
return; return;
} }
} }
var dataTypeEnitity = $(this).data('type'); var dataTypeEnitity = $(this).data('type'),
var datakeyEntity = $(this).data('key'); datakeyEntity = $(this).data('key'),
var typeNameCategory = that.typeHeaders.fullCollection.findWhere({ name: dataTypeEnitity }); typeName = $(this).data('querydata'),
typeNameCategory = that.typeHeaders.fullCollection.findWhere({ name: dataTypeEnitity });
// Extract Data // Extract Data
if (dataTypeEnitity && datakeyEntity) { if (dataTypeEnitity && datakeyEntity) {
if (that.entityDefCollection.fullCollection.find({ name: dataTypeEnitity })) { if (that.entityDefCollection.fullCollection.find({ name: dataTypeEnitity })) {
entity[datakeyEntity] = extractValue(value); entity[datakeyEntity] = extractValue(value, typeName);
} else if (typeof dataTypeEnitity === 'string' && datakeyEntity.indexOf("Time") > -1) { } else if (typeof dataTypeEnitity === 'string' && datakeyEntity.indexOf("Time") > -1) {
entity[datakeyEntity] = Date.parse(value); entity[datakeyEntity] = Date.parse(value);
} else if (dataTypeEnitity.indexOf("map") > -1 || (typeNameCategory && typeNameCategory.get('category') === 'STRUCT')) { } else if (dataTypeEnitity.indexOf("map") > -1 || (typeNameCategory && typeNameCategory.get('category') === 'STRUCT')) {
...@@ -618,7 +549,7 @@ define(['require', ...@@ -618,7 +549,7 @@ define(['require',
return; return;
} }
} else if (dataTypeEnitity.indexOf("array") > -1 && dataTypeEnitity.indexOf("string") === -1) { } else if (dataTypeEnitity.indexOf("array") > -1 && dataTypeEnitity.indexOf("string") === -1) {
entity[datakeyEntity] = extractValue(value); entity[datakeyEntity] = extractValue(value, typeName);
} else { } else {
if (_.isString(value)) { if (_.isString(value)) {
if (value.length) { if (value.length) {
...@@ -690,128 +621,116 @@ define(['require', ...@@ -690,128 +621,116 @@ define(['require',
this.ui.entityList.select2('close'); this.ui.entityList.select2('close');
}, },
addJsonSearchData: function() { addJsonSearchData: function() {
if (this.asyncFetchLOVCounter === 0) { var that = this;
var that = this, this.$('select[data-id="entitySelectData"]').each(function(value, key) {
queryText, var $this = $(this),
str = '', keyData = $(this).data("key"),
appendOption = function(optionValue) { typeData = $(this).data("type"),
var obj = optionValue.toJSON(), queryData = $(this).data("querydata"),
labelName = Utils.getName(obj, 'displayText'); skip = $(this).data('skip'),
if (obj && obj.queryText) { placeholderName = "Select a " + typeData + " from the dropdown list";
optionValue.set('labelName', labelName);
if (labelName) { $this.attr("multiple", ($this.data('type').indexOf("array") === -1 ? false : true));
var str = '<option>' + labelName + '</option>';
}
// appending value to all same droupdown
that.$('select[data-queryData="' + obj.queryText + '"]').append(str);
}
};
this.$('select[data-id="entitySelectData"]').each(function(value, key) { // Select Value.
var $this = $(this), if (that.guid) {
keyData = $(this).data("key"), var dataValue = that.entityData.get("entity").attributes[keyData],
typeData = $(this).data("type"), entities = that.entityData.get("entity").attributes,
queryData = $(this).data("querydata"), referredEntities = that.entityData.get("referredEntities"),
skip = $(this).data('skip'), selectedValue = [],
placeholderName = "Select a " + typeData + " from the dropdown list"; select2Options = [];
//add options. if (dataValue) {
if (that.selectStoreCollection.length && !this.options.length && !skip) { if (_.isObject(dataValue) && !_.isArray(dataValue)) {
that.selectStoreCollection.where({ queryText: queryData }).forEach(function(model) { dataValue = [dataValue];
var obj = model.toJSON(); }
if (obj.status) { _.each(dataValue, function(obj) {
if (!Enums.entityStateReadOnly[obj.status]) { if (_.isObject(obj) && obj.guid && referredEntities[obj.guid]) {
appendOption(model); var refEntiyFound = referredEntities[obj.guid];
refEntiyFound['id'] = refEntiyFound.guid;
if (!Enums.entityStateReadOnly[refEntiyFound.status]) {
select2Options.push(refEntiyFound);
selectedValue.push(refEntiyFound.guid);
} }
} else {
appendOption(model);
} }
}); });
} }
// Array of string.
$this.attr("multiple", ($this.data('type').indexOf("array") === -1 ? false : true)); if (selectedValue.length === 0 && dataValue && dataValue.length && ($this.data('querydata') === "string")) {
var str = "";
// Select Value. _.each(dataValue, function(obj) {
if (that.guid) { if (_.isString(obj)) {
var dataValue = that.entityData.get("entity").attributes[keyData], selectedValue.push(obj);
referredEntities = that.entityData.get("referredEntities"), str += '<option>' + _.escape(obj) + '</option>';
selectedValue = [];
if (!skip) {
//Uncoment when array of entity is not read-only
// var setValue = function(selectValue) {
// var obj = selectValue.toJSON();
// if (dataValue !== null && _.isArray(dataValue)) {
// _.each(dataValue, function(obj) {
// if (obj.guid === selectValue.attributes.guid) {
// selectedValue.push(selectValue.attributes.labelName);
// }
// });
// } else if (dataValue !== null) {
// if (dataValue.guid === selectValue.attributes.guid) {
// selectedValue.push(selectValue.attributes.labelName);
// }
// }
// }
// that.selectStoreCollection.each(function(storedValue) {
// var obj = storedValue.toJSON();
// if (obj.status) {
// if (!Enums.entityStateReadOnly[obj.status]) {
// setValue(storedValue);
// }
// } else {
// setValue(storedValue);
// }
// });
if (dataValue) {
var storeEntity = that.selectStoreCollection.findWhere({ guid: dataValue.guid });
var refEntiyFound = referredEntities[dataValue.guid]
if (storeEntity) {
var name = Utils.getName(storeEntity.toJSON(), 'displayText');
} else if (!storeEntity && refEntiyFound && refEntiyFound.typeName) {
that.selectStoreCollection.push(refEntiyFound);
var name = Utils.getName(refEntiyFound, 'displayText');
var str = '<option>' + name + '</option>';
that.$('select[data-queryData="' + refEntiyFound.typeName + '"]').append(str);
}
if (name && name.length) {
selectedValue.push(name);
}
} }
} });
$this.html(str);
}
// Array of string. } else {
if (selectedValue.length === 0 && dataValue && dataValue.length && ($this.data('querydata') === "string" || skip === true)) { $this.val([]);
var str = ""; }
_.each(dataValue, function(obj) { var select2Option = {
if (_.isString(obj)) { placeholder: placeholderName,
selectedValue.push(obj); allowClear: true,
str += '<option>' + _.escape(obj) + '</option>'; tags: ($this.data('querydata') == "string" ? true : false)
} else if (_.isObject(obj) && obj.guid && referredEntities[obj.guid]) { }
var name = Utils.getName(referredEntities[obj.guid], 'qualifiedName'); var getTypeAheadData = function(data, params) {
selectedValue.push(name); var dataList = data.entities,
str += '<option>' + name + '</option>'; foundOptions = [];
} _.each(dataList, function(obj) {
}); if (obj) {
$this.html(str); if (obj.guid) {
} obj['id'] = obj.guid;
if (selectedValue) { }
$this.val(selectedValue); foundOptions.push(obj);
} }
} else {
$this.val([]);
}
$this.select2({
placeholder: placeholderName,
allowClear: true,
tags: ($this.data('querydata') == "string" ? true : false)
}); });
}); return foundOptions;
this.hideLoader(); }
} if ($this.data('querydata') !== "string") {
_.extend(select2Option, {
ajax: {
url: UrlLinks.searchApiUrl('attribute'),
dataType: 'json',
delay: 250,
data: function(params) {
return {
attrValuePrefix: params.term, // search term
typeName: queryData,
limit: 10,
offset: 0
};
},
processResults: function(data, params) {
return {
results: getTypeAheadData(data, params)
};
},
cache: true
},
templateResult: function(option) {
var name = Utils.getName(option, 'qualifiedName');
return name === "-" ? option.text : name;
},
templateSelection: function(option) {
var name = Utils.getName(option, 'qualifiedName');
return name === "-" ? option.text : name;
},
escapeMarkup: function(markup) {
return markup;
},
data: select2Options,
minimumInputLength: 3
});
}
$this.select2(select2Option);
if (selectedValue) {
$this.val(selectedValue).trigger("change");
}
});
this.hideLoader();
} }
}); });
return CreateEntityLayoutView; return CreateEntityLayoutView;
......
dashboardv2/public/js/views/tag/addTagModalView.js
...@@ -223,6 +223,7 @@ define(['require', ...@@ -223,6 +223,7 @@ define(['require',
}); });
}, },
onChangeTagDefination: function() { onChangeTagDefination: function() {
this.ui.addTagOptions.select2("open").select2("close");
this.ui.tagAttribute.empty(); this.ui.tagAttribute.empty();
var saveBtn = this.modal.$el.find('button.ok'); var saveBtn = this.modal.$el.find('button.ok');
saveBtn.prop("disabled", false); saveBtn.prop("disabled", false);
......
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