Skip to content

A
atlas
Commit 3680ab42 by kevalbhatt
Options

ATLAS-3626 : Beta UI : No option to overwrite Saved Search

parent 70ebb228
Showing with 131 additions and 41 deletions
dashboardv3/public/css/scss/theme.scss
...@@ -829,4 +829,19 @@ td.searchTableName:hover { ...@@ -829,4 +829,19 @@ td.searchTableName:hover {
} }
} }
}
.select2-results__option {
&.select2-results__option--highlighted {
.option-title-light {
color: #eaeaea;
}
}
.option-title-light {
font-size: 12px;
color: #a4a4a4;
}
} }
\ No newline at end of file
dashboardv3/public/js/templates/search/save/SaveModalLayoutView_tmpl.html
...@@ -14,11 +14,16 @@ ...@@ -14,11 +14,16 @@
* 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.
--> -->
<form name="saveAsform" class="form-horizontal" data-id=""> <div class='fontLoader show'><i class='fa fa-refresh fa-spin-custom'></i></div>
<form name="saveAsform" class="form-horizontal hide" data-id="">
<div class="form-group"> <div class="form-group">
<label class="control-label col-sm-2 required" for="name">Name</label> <label class="control-label col-sm-2 required" for="name">Name</label>
<div class="col-sm-10"> <div class="col-sm-9">
{{#if rename}}
<input class="form-control" data-id="saveAsName" placeholder="Name(required)" value="{{selectedModel.name}}" autofocus /> <input class="form-control" data-id="saveAsName" placeholder="Name(required)" value="{{selectedModel.name}}" autofocus />
{{else}}
<select data-id="saveAsName"></select>
{{/if}}
</div> </div>
</div> </div>
</form> </form>
\ No newline at end of file
dashboardv3/public/js/views/search/save/SaveModalLayoutView.js
...@@ -24,9 +24,10 @@ define(['require', ...@@ -24,9 +24,10 @@ define(['require',
'utils/UrlLinks', 'utils/UrlLinks',
'platform', 'platform',
'models/VSearch', 'models/VSearch',
"collection/VSearchList",
'utils/CommonViewFunction', 'utils/CommonViewFunction',
'utils/Messages' 'utils/Messages'
], function(require, Backbone, SaveModalLayoutViewTmpl, Utils, Modal, UrlLinks, platform, VSearch, CommonViewFunction, Messages) { ], function(require, Backbone, SaveModalLayoutViewTmpl, Utils, Modal, UrlLinks, platform, VSearch, VSearchList, CommonViewFunction, Messages) {
var SaveModalLayoutView = Backbone.Marionette.LayoutView.extend({ var SaveModalLayoutView = Backbone.Marionette.LayoutView.extend({
...@@ -38,7 +39,8 @@ define(['require', ...@@ -38,7 +39,8 @@ define(['require',
}, },
templateHelpers: function() { templateHelpers: function() {
return { return {
selectedModel: this.selectedModel ? this.selectedModel.toJSON() : null selectedModel: this.selectedModel ? this.selectedModel.toJSON() : null,
rename: this.rename
}; };
}, },
events: function() { events: function() {
...@@ -47,20 +49,32 @@ define(['require', ...@@ -47,20 +49,32 @@ define(['require',
}, },
initialize: function(options) { initialize: function(options) {
var that = this; var that = this;
_.extend(this, _.pick(options, 'selectedModel', 'collection', 'getValue', 'isBasic', 'saveObj')); _.extend(this, _.pick(options, 'rename', 'selectedModel', 'collection', 'getValue', 'isBasic', 'saveObj'));
this.model = new VSearch(); this.model = new VSearch();
this.saveSearchCollection = new VSearchList();
this.saveSearchCollection.url = UrlLinks.saveSearchApiUrl();
this.saveSearchCollection.fullCollection.comparator = function(model) {
return getModelName(model);
}
function getModelName(model) {
if (model.get('name')) {
return model.get('name').toLowerCase();
}
};
if (this.saveObj) { if (this.saveObj) {
this.onCreateButton(); this.onCreateButton();
} else { } else {
var modal = new Modal({ this.modal = modal = new Modal({
titleHtml: true, titleHtml: true,
title: '<span>' + (this.selectedModel ? 'Rename' : 'Save') + (this.isBasic ? " Basic" : " Advanced") + ' Custom Filter</span>', title: '<span>' + (this.selectedModel && this.rename ? 'Rename' : 'Save/Save As..') + (this.isBasic ? " Basic" : " Advanced") + ' Custom Filter</span>',
content: this, content: this,
cancelText: "Cancel", cancelText: "Cancel",
okCloses: false, okCloses: false,
okText: this.selectedModel ? 'Update' : 'Save', okText: this.selectedModel ? 'Update' : 'Save',
allowCancel: true allowCancel: true
}).open(); });
this.modal.open();
modal.$el.find('button.ok').attr("disabled", "true"); modal.$el.find('button.ok').attr("disabled", "true");
this.ui.saveAsName.on('keyup', function(e) { this.ui.saveAsName.on('keyup', function(e) {
modal.$el.find('button.ok').removeAttr("disabled"); modal.$el.find('button.ok').removeAttr("disabled");
...@@ -72,27 +86,84 @@ define(['require', ...@@ -72,27 +86,84 @@ define(['require',
}); });
modal.on('ok', function() { modal.on('ok', function() {
modal.$el.find('button.ok').attr("disabled", "true"); modal.$el.find('button.ok').attr("disabled", "true");
that.onCreateButton(modal); that.onCreateButton();
}); });
modal.on('closeModal', function() { modal.on('closeModal', function() {
modal.trigger('cancel'); modal.trigger('cancel');
}); });
} }
}, },
onCreateButton: function(modal) { hideLoader: function() {
this.$el.find("form").removeClass("hide");
this.$el.find(".fontLoader").removeClass("show");
},
onRender: function() {
if (this.rename == true) {
this.hideLoader();
} else {
var that = this;
this.saveSearchCollection.fetch({
success: function(collection, data) {
that.saveSearchCollection.fullCollection.reset(_.where(data, { searchType: that.isBasic ? "BASIC" : "ADVANCED" }));
var options = "";
that.saveSearchCollection.fullCollection.each(function(model) {
options += '<option value="' + model.get("name") + '">' + model.get("name") + '</option>';
})
that.ui.saveAsName.append(options);
that.ui.saveAsName.val("");
that.ui.saveAsName.select2({
placeholder: "Save/Save As.. filter",
allowClear: false,
tags: true,
multiple: false,
templateResult: function(state) {
if (!state.id) {
return state.text;
}
if (!state.element) {
return $("<span><span class='option-title-light'>Save:</span> <strong> " + _.escape(state.text) + "</strong></span>");
} else {
return $("<span><span class='option-title-light'>Save As:</span> <strong>" + _.escape(state.text) + "</strong></span>");
}
}
}).on("change", function() {
var val = that.ui.saveAsName.val();
if (val.length) {
that.selectedModel = that.saveSearchCollection.fullCollection.find({ name: val });
if (that.selectedModel) {
that.modal.$el.find('button.ok').text("Save As");
} else {
that.modal.$el.find('button.ok').text("Save");
}
that.modal.$el.find('button.ok').removeAttr("disabled");
} else {
that.modal.$el.find('button.ok').attr("disabled", "true");
that.selectedModel = null;
}
});
},
silent: true
});
this.hideLoader();
}
},
onCreateButton: function() {
var that = this, var that = this,
obj = { name: this.ui.saveAsName.val ? this.ui.saveAsName.val() : null }; obj = { name: this.ui.saveAsName.val() || null, value: this.getValue() };
if (this.saveObj) {
// Save search Filter
_.extend(obj, this.saveObj);
}
var saveObj = CommonViewFunction.generateObjectForSaveSearchApi(obj);
if (this.selectedModel) { if (this.selectedModel) {
// Update Name only. // Update Name only.
var saveObj = this.selectedModel.toJSON(); var selectedModel = this.selectedModel.toJSON();
saveObj.name = obj.name; if (this.rename !== true) {
} else { _.extend(selectedModel.searchParameters, saveObj.searchParameters);
obj.value = this.getValue();
if (this.saveObj) {
// Save search Filter
_.extend(obj, this.saveObj);
} }
var saveObj = CommonViewFunction.generateObjectForSaveSearchApi(obj); selectedModel.name = obj.name;
saveObj = selectedModel;
} else {
if (this.isBasic) { if (this.isBasic) {
saveObj['searchType'] = "BASIC"; saveObj['searchType'] = "BASIC";
} else { } else {
...@@ -125,8 +196,8 @@ define(['require', ...@@ -125,8 +196,8 @@ define(['require',
} }
}); });
if (modal) { if (this.modal) {
modal.trigger('cancel'); this.modal.trigger('cancel');
} }
} }
}); });
......
dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js
...@@ -74,7 +74,7 @@ define([ ...@@ -74,7 +74,7 @@ define([
this.ui.groupOrFlatTree.find("i").toggleClass("group-tree-deactivate"); this.ui.groupOrFlatTree.find("i").toggleClass("group-tree-deactivate");
this.ui.groupOrFlatTree.find("span").html(this.isGroupView ? "Show flat tree" : "Show group tree"); this.ui.groupOrFlatTree.find("span").html(this.isGroupView ? "Show flat tree" : "Show group tree");
that.ui[type + "SearchTree"].jstree(true).destroy(); that.ui[type + "SearchTree"].jstree(true).destroy();
that.renderCustomFilter(); that.fetchCustomFilter();
}; };
return events; return events;
...@@ -133,6 +133,18 @@ define([ ...@@ -133,6 +133,18 @@ define([
this.saveSearchCollection = new VSearchList(); this.saveSearchCollection = new VSearchList();
this.saveSearchAdvanceCollection = new VSearchList(); this.saveSearchAdvanceCollection = new VSearchList();
this.saveSearchCollection.url = UrlLinks.saveSearchApiUrl(); this.saveSearchCollection.url = UrlLinks.saveSearchApiUrl();
this.saveSearchBaiscCollection.fullCollection.comparator = function(model) {
return getModelName(model);
}
this.saveSearchAdvanceCollection.fullCollection.comparator = function(model) {
return getModelName(model);
}
function getModelName(model) {
if (model.get('name')) {
return model.get('name').toLowerCase();
}
};
this.bindEvents(); this.bindEvents();
this.customFilterData = null; this.customFilterData = null;
this.isBasic = true; this.isBasic = true;
...@@ -140,7 +152,7 @@ define([ ...@@ -140,7 +152,7 @@ define([
this.isGroupView = true; this.isGroupView = true;
}, },
onRender: function() { onRender: function() {
this.renderCustomFilter(); this.fetchCustomFilter();
}, },
manualRender: function(options) { manualRender: function(options) {
_.extend(this.options, options); _.extend(this.options, options);
...@@ -160,21 +172,8 @@ define([ ...@@ -160,21 +172,8 @@ define([
}); });
this.createCustomFilterAction(); this.createCustomFilterAction();
}, },
renderCustomFilter: function() { fetchCustomFilter: function() {
var that = this; var that = this;
this.saveSearchBaiscCollection.fullCollection.comparator = function(model) {
return getModelName(model);
}
this.saveSearchAdvanceCollection.fullCollection.comparator = function(model) {
return getModelName(model);
}
function getModelName(model) {
if (model.get('name')) {
return model.get('name').toLowerCase();
}
};
this.saveSearchCollection.fetch({ this.saveSearchCollection.fetch({
success: function(collection, data) { success: function(collection, data) {
that.saveSearchBaiscCollection.fullCollection.reset(_.where(data, { searchType: "BASIC" })); that.saveSearchBaiscCollection.fullCollection.reset(_.where(data, { searchType: "BASIC" }));
...@@ -403,9 +402,7 @@ define([ ...@@ -403,9 +402,7 @@ define([
require([ require([
'views/search/save/SaveModalLayoutView' 'views/search/save/SaveModalLayoutView'
], function(SaveModalLayoutView) { ], function(SaveModalLayoutView) {
new SaveModalLayoutView({ 'rename': true, 'selectedModel': options.model.clone(), 'collection': that.isBasic ? that.saveSearchBaiscCollection.fullCollection : that.saveSearchAdvanceCollection.fullCollection, 'getValue': that.getValue, 'isBasic': that.isBasic });
new SaveModalLayoutView({ 'selectedModel': options.model.clone(), 'collection': that.isBasic ? that.saveSearchBaiscCollection.fullCollection : that.saveSearchAdvanceCollection.fullCollection, 'getValue': that.getValue, 'isBasic': that.isBasic });
}); });
} }
}, },
...@@ -474,7 +471,7 @@ define([ ...@@ -474,7 +471,7 @@ define([
} }
}, },
refreshCustomFilterTree: function() { refreshCustomFilterTree: function() {
this.ui.customFilterSearchTree.jstree(true).refresh(); this.fetchCustomFilter();
} }
}); });
......
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