You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@atlas.apache.org by kb...@apache.org on 2020/02/21 06:26:33 UTC
[atlas] 02/03: ATLAS-3626 : Beta UI : No option to overwrite Saved
Search
This is an automated email from the ASF dual-hosted git repository.
kbhatt pushed a commit to branch branch-2.0
in repository https://gitbox.apache.org/repos/asf/atlas.git
commit 07d1c72617383af08c4d83e5b01c9d4103d259f6
Author: kevalbhatt <kb...@apache.org>
AuthorDate: Thu Feb 20 15:33:51 2020 +0530
ATLAS-3626 : Beta UI : No option to overwrite Saved Search
(cherry picked from commit 3680ab428969bcc23606537d1dab49171bcc37ab)
---
dashboardv3/public/css/scss/theme.scss | 15 +++
.../search/save/SaveModalLayoutView_tmpl.html | 9 +-
.../js/views/search/save/SaveModalLayoutView.js | 109 +++++++++++++++++----
.../search/tree/CustomFilterTreeLayoutView.js | 37 ++++---
4 files changed, 129 insertions(+), 41 deletions(-)
diff --git a/dashboardv3/public/css/scss/theme.scss b/dashboardv3/public/css/scss/theme.scss
index 56e998c..2b0c45d 100644
--- a/dashboardv3/public/css/scss/theme.scss
+++ b/dashboardv3/public/css/scss/theme.scss
@@ -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
diff --git a/dashboardv3/public/js/templates/search/save/SaveModalLayoutView_tmpl.html b/dashboardv3/public/js/templates/search/save/SaveModalLayoutView_tmpl.html
index 7b199bd..23f4beb 100644
--- a/dashboardv3/public/js/templates/search/save/SaveModalLayoutView_tmpl.html
+++ b/dashboardv3/public/js/templates/search/save/SaveModalLayoutView_tmpl.html
@@ -14,11 +14,16 @@
* See the License for the specific language governing permissions and
* 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">
<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 />
+ {{else}}
+ <select data-id="saveAsName"></select>
+ {{/if}}
</div>
</div>
</form>
\ No newline at end of file
diff --git a/dashboardv3/public/js/views/search/save/SaveModalLayoutView.js b/dashboardv3/public/js/views/search/save/SaveModalLayoutView.js
index bfc1d9f..9d8c8c1 100644
--- a/dashboardv3/public/js/views/search/save/SaveModalLayoutView.js
+++ b/dashboardv3/public/js/views/search/save/SaveModalLayoutView.js
@@ -24,9 +24,10 @@ define(['require',
'utils/UrlLinks',
'platform',
'models/VSearch',
+ "collection/VSearchList",
'utils/CommonViewFunction',
'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({
@@ -38,7 +39,8 @@ define(['require',
},
templateHelpers: function() {
return {
- selectedModel: this.selectedModel ? this.selectedModel.toJSON() : null
+ selectedModel: this.selectedModel ? this.selectedModel.toJSON() : null,
+ rename: this.rename
};
},
events: function() {
@@ -47,20 +49,32 @@ define(['require',
},
initialize: function(options) {
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.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) {
this.onCreateButton();
} else {
- var modal = new Modal({
+ this.modal = modal = new Modal({
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,
cancelText: "Cancel",
okCloses: false,
okText: this.selectedModel ? 'Update' : 'Save',
allowCancel: true
- }).open();
+ });
+ this.modal.open();
modal.$el.find('button.ok').attr("disabled", "true");
this.ui.saveAsName.on('keyup', function(e) {
modal.$el.find('button.ok').removeAttr("disabled");
@@ -72,27 +86,84 @@ define(['require',
});
modal.on('ok', function() {
modal.$el.find('button.ok').attr("disabled", "true");
- that.onCreateButton(modal);
+ that.onCreateButton();
});
modal.on('closeModal', function() {
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,
- 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) {
// Update Name only.
- var saveObj = this.selectedModel.toJSON();
- saveObj.name = obj.name;
- } else {
- obj.value = this.getValue();
- if (this.saveObj) {
- // Save search Filter
- _.extend(obj, this.saveObj);
+ var selectedModel = this.selectedModel.toJSON();
+ if (this.rename !== true) {
+ _.extend(selectedModel.searchParameters, saveObj.searchParameters);
}
- var saveObj = CommonViewFunction.generateObjectForSaveSearchApi(obj);
+ selectedModel.name = obj.name;
+ saveObj = selectedModel;
+ } else {
if (this.isBasic) {
saveObj['searchType'] = "BASIC";
} else {
@@ -125,8 +196,8 @@ define(['require',
}
});
- if (modal) {
- modal.trigger('cancel');
+ if (this.modal) {
+ this.modal.trigger('cancel');
}
}
});
diff --git a/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js b/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js
index 9766b32..3031ced 100644
--- a/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js
+++ b/dashboardv3/public/js/views/search/tree/CustomFilterTreeLayoutView.js
@@ -74,7 +74,7 @@ define([
this.ui.groupOrFlatTree.find("i").toggleClass("group-tree-deactivate");
this.ui.groupOrFlatTree.find("span").html(this.isGroupView ? "Show flat tree" : "Show group tree");
that.ui[type + "SearchTree"].jstree(true).destroy();
- that.renderCustomFilter();
+ that.fetchCustomFilter();
};
return events;
@@ -133,6 +133,18 @@ define([
this.saveSearchCollection = new VSearchList();
this.saveSearchAdvanceCollection = new VSearchList();
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.customFilterData = null;
this.isBasic = true;
@@ -140,7 +152,7 @@ define([
this.isGroupView = true;
},
onRender: function() {
- this.renderCustomFilter();
+ this.fetchCustomFilter();
},
manualRender: function(options) {
_.extend(this.options, options);
@@ -160,21 +172,8 @@ define([
});
this.createCustomFilterAction();
},
- renderCustomFilter: function() {
+ fetchCustomFilter: function() {
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({
success: function(collection, data) {
that.saveSearchBaiscCollection.fullCollection.reset(_.where(data, { searchType: "BASIC" }));
@@ -403,9 +402,7 @@ define([
require([
'views/search/save/SaveModalLayoutView'
], function(SaveModalLayoutView) {
-
- new SaveModalLayoutView({ 'selectedModel': options.model.clone(), 'collection': that.isBasic ? that.saveSearchBaiscCollection.fullCollection : that.saveSearchAdvanceCollection.fullCollection, 'getValue': that.getValue, 'isBasic': that.isBasic });
-
+ new SaveModalLayoutView({ 'rename': true, 'selectedModel': options.model.clone(), 'collection': that.isBasic ? that.saveSearchBaiscCollection.fullCollection : that.saveSearchAdvanceCollection.fullCollection, 'getValue': that.getValue, 'isBasic': that.isBasic });
});
}
},
@@ -474,7 +471,7 @@ define([
}
},
refreshCustomFilterTree: function() {
- this.ui.customFilterSearchTree.jstree(true).refresh();
+ this.fetchCustomFilter();
}
});