mirror of
https://github.com/pgadmin-org/pgadmin4.git
synced 2025-02-25 18:55:31 -06:00
Update filter dialogue Javascript to use ES6.
This commit is contained in:
Murtuza Zabuawala
committed by
Dave Page
Dave Page
parent
a97e4c76e4
commit
78c3db6fc9
@@ -1,243 +1,241 @@
|
|||||||
define([
|
import gettext from 'sources/gettext';
|
||||||
'sources/gettext', 'sources/url_for', 'jquery', 'underscore', 'underscore.string',
|
import url_for from 'sources/url_for';
|
||||||
'pgadmin.alertifyjs', 'sources/pgadmin', 'backbone',
|
import $ from 'jquery';
|
||||||
'pgadmin.backgrid', 'pgadmin.backform', 'axios',
|
import Alertify from 'pgadmin.alertifyjs';
|
||||||
'sources/sqleditor/query_tool_actions',
|
import pgAdmin from 'sources/pgadmin';
|
||||||
'sources/sqleditor/filter_dialog_model',
|
import Backform from 'pgadmin.backform';
|
||||||
//'pgadmin.browser.node.ui',
|
import axios from 'axios';
|
||||||
], function(
|
import queryToolActions from 'sources/sqleditor/query_tool_actions';
|
||||||
gettext, url_for, $, _, S, Alertify, pgAdmin, Backbone,
|
import filterDialogModel from 'sources/sqleditor/filter_dialog_model';
|
||||||
Backgrid, Backform, axios, queryToolActions, filterDialogModel
|
|
||||||
) {
|
|
||||||
|
|
||||||
let FilterDialog = {
|
let FilterDialog = {
|
||||||
'dialog': function(handler) {
|
'dialog': function(handler) {
|
||||||
let title = gettext('Sort/Filter options');
|
let title = gettext('Sort/Filter options');
|
||||||
axios.get(
|
axios.get(
|
||||||
url_for('sqleditor.get_filter_data', {
|
url_for('sqleditor.get_filter_data', {
|
||||||
'trans_id': handler.transId,
|
'trans_id': handler.transId,
|
||||||
}),
|
}),
|
||||||
{ headers: {'Cache-Control' : 'no-cache'} }
|
{ headers: {'Cache-Control' : 'no-cache'} }
|
||||||
).then(function (res) {
|
).then(function (res) {
|
||||||
let response = res.data.data.result;
|
let response = res.data.data.result;
|
||||||
|
|
||||||
// Check the alertify dialog already loaded then delete it to clear
|
// Check the alertify dialog already loaded then delete it to clear
|
||||||
// the cache
|
// the cache
|
||||||
if (Alertify.filterDialog) {
|
if (Alertify.filterDialog) {
|
||||||
delete Alertify.filterDialog;
|
delete Alertify.filterDialog;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Create Dialog
|
// Create Dialog
|
||||||
Alertify.dialog('filterDialog', function factory() {
|
Alertify.dialog('filterDialog', function factory() {
|
||||||
let $container = $('<div class=\'data_sorting_dialog\'></div>');
|
let $container = $('<div class=\'data_sorting_dialog\'></div>');
|
||||||
return {
|
return {
|
||||||
main: function() {
|
main: function() {
|
||||||
this.set('title', gettext('Sort/Filter options'));
|
this.set('title', gettext('Sort/Filter options'));
|
||||||
},
|
},
|
||||||
build: function() {
|
build: function() {
|
||||||
this.elements.content.appendChild($container.get(0));
|
this.elements.content.appendChild($container.get(0));
|
||||||
Alertify.pgDialogBuild.apply(this);
|
Alertify.pgDialogBuild.apply(this);
|
||||||
},
|
},
|
||||||
setup: function() {
|
setup: function() {
|
||||||
return {
|
return {
|
||||||
buttons: [{
|
buttons: [{
|
||||||
text: '',
|
text: '',
|
||||||
key: 112,
|
key: 112,
|
||||||
className: 'btn btn-default pull-left fa fa-lg fa-question',
|
className: 'btn btn-default pull-left fa fa-lg fa-question',
|
||||||
attrs: {
|
attrs: {
|
||||||
name: 'dialog_help',
|
name: 'dialog_help',
|
||||||
type: 'button',
|
type: 'button',
|
||||||
label: gettext('Help'),
|
label: gettext('Help'),
|
||||||
url: url_for('help.static', {
|
url: url_for('help.static', {
|
||||||
'filename': 'editgrid.html',
|
'filename': 'editgrid.html',
|
||||||
}),
|
}),
|
||||||
},
|
|
||||||
}, {
|
|
||||||
text: gettext('Ok'),
|
|
||||||
className: 'btn btn-primary fa fa-lg fa-save pg-alertify-button',
|
|
||||||
'data-btn-name': 'ok',
|
|
||||||
}, {
|
|
||||||
text: gettext('Cancel'),
|
|
||||||
key: 27,
|
|
||||||
className: 'btn btn-danger fa fa-lg fa-times pg-alertify-button',
|
|
||||||
'data-btn-name': 'cancel',
|
|
||||||
}],
|
|
||||||
// Set options for dialog
|
|
||||||
options: {
|
|
||||||
title: title,
|
|
||||||
//disable both padding and overflow control.
|
|
||||||
padding: !1,
|
|
||||||
overflow: !1,
|
|
||||||
model: 0,
|
|
||||||
resizable: true,
|
|
||||||
maximizable: true,
|
|
||||||
pinnable: false,
|
|
||||||
closableByDimmer: false,
|
|
||||||
modal: false,
|
|
||||||
autoReset: false,
|
|
||||||
},
|
},
|
||||||
};
|
}, {
|
||||||
},
|
text: gettext('Ok'),
|
||||||
hooks: {
|
className: 'btn btn-primary fa fa-lg fa-save pg-alertify-button',
|
||||||
// triggered when the dialog is closed
|
'data-btn-name': 'ok',
|
||||||
onclose: function() {
|
}, {
|
||||||
if (this.view) {
|
text: gettext('Cancel'),
|
||||||
this.filterCollectionModel.stopSession();
|
key: 27,
|
||||||
this.view.model.stopSession();
|
className: 'btn btn-danger fa fa-lg fa-times pg-alertify-button',
|
||||||
this.view.remove({
|
'data-btn-name': 'cancel',
|
||||||
data: true,
|
}],
|
||||||
internal: true,
|
// Set options for dialog
|
||||||
silent: true,
|
options: {
|
||||||
});
|
title: title,
|
||||||
}
|
//disable both padding and overflow control.
|
||||||
|
padding: !1,
|
||||||
|
overflow: !1,
|
||||||
|
model: 0,
|
||||||
|
resizable: true,
|
||||||
|
maximizable: true,
|
||||||
|
pinnable: false,
|
||||||
|
closableByDimmer: false,
|
||||||
|
modal: false,
|
||||||
|
autoReset: false,
|
||||||
},
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
hooks: {
|
||||||
|
// triggered when the dialog is closed
|
||||||
|
onclose: function() {
|
||||||
|
if (this.view) {
|
||||||
|
this.filterCollectionModel.stopSession();
|
||||||
|
this.view.model.stopSession();
|
||||||
|
this.view.remove({
|
||||||
|
data: true,
|
||||||
|
internal: true,
|
||||||
|
silent: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
},
|
},
|
||||||
prepare: function() {
|
},
|
||||||
let self = this;
|
prepare: function() {
|
||||||
$container.html('');
|
let self = this;
|
||||||
// Disable Ok button
|
$container.html('');
|
||||||
this.__internal.buttons[1].element.disabled = true;
|
// Disable Ok button
|
||||||
|
this.__internal.buttons[1].element.disabled = true;
|
||||||
|
|
||||||
// Status bar
|
// Status bar
|
||||||
this.statusBar = $('<div class=\'pg-prop-status-bar pg-el-xs-12 hide\'>' +
|
this.statusBar = $('<div class=\'pg-prop-status-bar pg-el-xs-12 hide\'>' +
|
||||||
' <div class=\'media error-in-footer bg-red-1 border-red-2 font-red-3 text-14\'>' +
|
' <div class=\'media error-in-footer bg-red-1 border-red-2 font-red-3 text-14\'>' +
|
||||||
' <div class=\'media-body media-middle\'>' +
|
' <div class=\'media-body media-middle\'>' +
|
||||||
' <div class=\'alert-icon error-icon\'>' +
|
' <div class=\'alert-icon error-icon\'>' +
|
||||||
' <i class=\'fa fa-exclamation-triangle\' aria-hidden=\'true\'></i>' +
|
' <i class=\'fa fa-exclamation-triangle\' aria-hidden=\'true\'></i>' +
|
||||||
' </div>' +
|
' </div>' +
|
||||||
' <div class=\'alert-text\'>' +
|
' <div class=\'alert-text\'>' +
|
||||||
' </div>' +
|
' </div>' +
|
||||||
' </div>' +
|
' </div>' +
|
||||||
' </div>' +
|
' </div>' +
|
||||||
'</div>', {
|
'</div>', {
|
||||||
text: '',
|
text: '',
|
||||||
}).appendTo($container);
|
}).appendTo($container);
|
||||||
|
|
||||||
// To show progress on filter Saving/Updating on AJAX
|
// To show progress on filter Saving/Updating on AJAX
|
||||||
this.showFilterProgress = $(
|
this.showFilterProgress = $(
|
||||||
'<div id="show_filter_progress" class="wcLoadingIconContainer busy-fetching hidden">' +
|
'<div id="show_filter_progress" class="wcLoadingIconContainer busy-fetching hidden">' +
|
||||||
'<div class="wcLoadingBackground"></div>' +
|
'<div class="wcLoadingBackground"></div>' +
|
||||||
'<span class="wcLoadingIcon fa fa-spinner fa-pulse"></span>' +
|
'<span class="wcLoadingIcon fa fa-spinner fa-pulse"></span>' +
|
||||||
'<span class="busy-text wcLoadingLabel">' + gettext('Loading data...') + '</span>' +
|
'<span class="busy-text wcLoadingLabel">' + gettext('Loading data...') + '</span>' +
|
||||||
'</div>').appendTo($container);
|
'</div>').appendTo($container);
|
||||||
|
|
||||||
|
$(
|
||||||
|
self.showFilterProgress[0]
|
||||||
|
).removeClass('hidden');
|
||||||
|
|
||||||
|
self.filterCollectionModel = filterDialogModel(response);
|
||||||
|
|
||||||
|
let fields = Backform.generateViewSchema(
|
||||||
|
null, self.filterCollectionModel, 'create', null, null, true
|
||||||
|
);
|
||||||
|
|
||||||
|
let view = this.view = new Backform.Dialog({
|
||||||
|
el: '<div></div>',
|
||||||
|
model: self.filterCollectionModel,
|
||||||
|
schema: fields,
|
||||||
|
});
|
||||||
|
|
||||||
|
$(this.elements.body.childNodes[0]).addClass(
|
||||||
|
'alertify_tools_dialog_properties obj_properties'
|
||||||
|
);
|
||||||
|
|
||||||
|
$container.append(view.render().$el);
|
||||||
|
|
||||||
|
// Enable/disable save button and show/hide statusbar based on session
|
||||||
|
view.listenTo(view.model, 'pgadmin-session:start', function() {
|
||||||
|
view.listenTo(view.model, 'pgadmin-session:invalid', function(msg) {
|
||||||
|
self.statusBar.removeClass('hide');
|
||||||
|
$(self.statusBar.find('.alert-text')).html(msg);
|
||||||
|
// Disable Okay button
|
||||||
|
self.__internal.buttons[1].element.disabled = true;
|
||||||
|
});
|
||||||
|
|
||||||
|
view.listenTo(view.model, 'pgadmin-session:valid', function() {
|
||||||
|
self.statusBar.addClass('hide');
|
||||||
|
$(self.statusBar.find('.alert-text')).html('');
|
||||||
|
// Enable Okay button
|
||||||
|
self.__internal.buttons[1].element.disabled = false;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
view.listenTo(view.model, 'pgadmin-session:stop', function() {
|
||||||
|
view.stopListening(view.model, 'pgadmin-session:invalid');
|
||||||
|
view.stopListening(view.model, 'pgadmin-session:valid');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Starts monitoring changes to model
|
||||||
|
view.model.startNewSession();
|
||||||
|
|
||||||
|
// Set data in collection
|
||||||
|
let viewDataSortingModel = view.model.get('data_sorting');
|
||||||
|
viewDataSortingModel.add(response['data_sorting']);
|
||||||
|
|
||||||
|
// Hide Progress ...
|
||||||
|
$(
|
||||||
|
self.showFilterProgress[0]
|
||||||
|
).addClass('hidden');
|
||||||
|
|
||||||
|
},
|
||||||
|
// Callback functions when click on the buttons of the Alertify dialogs
|
||||||
|
callback: function(e) {
|
||||||
|
let self = this;
|
||||||
|
|
||||||
|
if (e.button.element.name == 'dialog_help') {
|
||||||
|
e.cancel = true;
|
||||||
|
pgAdmin.Browser.showHelp(e.button.element.name, e.button.element.getAttribute('url'),
|
||||||
|
null, null, e.button.element.getAttribute('label'));
|
||||||
|
return;
|
||||||
|
} else if (e.button['data-btn-name'] === 'ok') {
|
||||||
|
e.cancel = true; // Do not close dialog
|
||||||
|
|
||||||
|
let filterCollectionModel = this.filterCollectionModel.toJSON();
|
||||||
|
|
||||||
|
// Show Progress ...
|
||||||
$(
|
$(
|
||||||
self.showFilterProgress[0]
|
self.showFilterProgress[0]
|
||||||
).removeClass('hidden');
|
).removeClass('hidden');
|
||||||
|
|
||||||
self.filterCollectionModel = filterDialogModel(response);
|
axios.put(
|
||||||
|
url_for('sqleditor.set_filter_data', {
|
||||||
let fields = Backform.generateViewSchema(
|
'trans_id': handler.transId,
|
||||||
null, self.filterCollectionModel, 'create', null, null, true
|
}),
|
||||||
);
|
filterCollectionModel
|
||||||
|
).then(function () {
|
||||||
let view = this.view = new Backform.Dialog({
|
// Hide Progress ...
|
||||||
el: '<div></div>',
|
|
||||||
model: self.filterCollectionModel,
|
|
||||||
schema: fields,
|
|
||||||
});
|
|
||||||
|
|
||||||
$(this.elements.body.childNodes[0]).addClass(
|
|
||||||
'alertify_tools_dialog_properties obj_properties'
|
|
||||||
);
|
|
||||||
|
|
||||||
$container.append(view.render().$el);
|
|
||||||
|
|
||||||
// Enable/disable save button and show/hide statusbar based on session
|
|
||||||
view.listenTo(view.model, 'pgadmin-session:start', function() {
|
|
||||||
view.listenTo(view.model, 'pgadmin-session:invalid', function(msg) {
|
|
||||||
self.statusBar.removeClass('hide');
|
|
||||||
$(self.statusBar.find('.alert-text')).html(msg);
|
|
||||||
// Disable Okay button
|
|
||||||
self.__internal.buttons[1].element.disabled = true;
|
|
||||||
});
|
|
||||||
|
|
||||||
view.listenTo(view.model, 'pgadmin-session:valid', function() {
|
|
||||||
self.statusBar.addClass('hide');
|
|
||||||
$(self.statusBar.find('.alert-text')).html('');
|
|
||||||
// Enable Okay button
|
|
||||||
self.__internal.buttons[1].element.disabled = false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
view.listenTo(view.model, 'pgadmin-session:stop', function() {
|
|
||||||
view.stopListening(view.model, 'pgadmin-session:invalid');
|
|
||||||
view.stopListening(view.model, 'pgadmin-session:valid');
|
|
||||||
});
|
|
||||||
|
|
||||||
// Starts monitoring changes to model
|
|
||||||
view.model.startNewSession();
|
|
||||||
|
|
||||||
// Set data in collection
|
|
||||||
let viewDataSortingModel = view.model.get('data_sorting');
|
|
||||||
viewDataSortingModel.add(response['data_sorting']);
|
|
||||||
|
|
||||||
// Hide Progress ...
|
|
||||||
$(
|
|
||||||
self.showFilterProgress[0]
|
|
||||||
).addClass('hidden');
|
|
||||||
|
|
||||||
},
|
|
||||||
// Callback functions when click on the buttons of the Alertify dialogs
|
|
||||||
callback: function(e) {
|
|
||||||
let self = this;
|
|
||||||
|
|
||||||
if (e.button.element.name == 'dialog_help') {
|
|
||||||
e.cancel = true;
|
|
||||||
pgAdmin.Browser.showHelp(e.button.element.name, e.button.element.getAttribute('url'),
|
|
||||||
null, null, e.button.element.getAttribute('label'));
|
|
||||||
return;
|
|
||||||
} else if (e.button['data-btn-name'] === 'ok') {
|
|
||||||
e.cancel = true; // Do not close dialog
|
|
||||||
|
|
||||||
let filterCollectionModel = this.filterCollectionModel.toJSON();
|
|
||||||
|
|
||||||
// Show Progress ...
|
|
||||||
$(
|
$(
|
||||||
self.showFilterProgress[0]
|
self.showFilterProgress[0]
|
||||||
).removeClass('hidden');
|
).addClass('hidden');
|
||||||
|
setTimeout(
|
||||||
|
function() {
|
||||||
|
self.close(); // Close the dialog now
|
||||||
|
Alertify.success(gettext('Filter updated successfully'));
|
||||||
|
queryToolActions.executeQuery(handler);
|
||||||
|
}, 10
|
||||||
|
);
|
||||||
|
|
||||||
axios.put(
|
}).catch(function (error) {
|
||||||
url_for('sqleditor.set_filter_data', {
|
// Hide Progress ...
|
||||||
'trans_id': handler.transId,
|
$(
|
||||||
}),
|
self.showFilterProgress[0]
|
||||||
filterCollectionModel
|
).addClass('hidden');
|
||||||
).then(function () {
|
handler.onExecuteHTTPError(error);
|
||||||
// Hide Progress ...
|
|
||||||
$(
|
|
||||||
self.showFilterProgress[0]
|
|
||||||
).addClass('hidden');
|
|
||||||
setTimeout(
|
|
||||||
function() {
|
|
||||||
self.close(); // Close the dialog now
|
|
||||||
Alertify.success(gettext('Filter updated successfully'));
|
|
||||||
queryToolActions.executeQuery(handler);
|
|
||||||
}, 10
|
|
||||||
);
|
|
||||||
|
|
||||||
}).catch(function (error) {
|
setTimeout(
|
||||||
// Hide Progress ...
|
function() {
|
||||||
$(
|
Alertify.error(error);
|
||||||
self.showFilterProgress[0]
|
}, 10
|
||||||
).addClass('hidden');
|
);
|
||||||
handler.onExecuteHTTPError(error);
|
});
|
||||||
|
} else {
|
||||||
setTimeout(
|
self.close();
|
||||||
function() {
|
}
|
||||||
Alertify.error(error);
|
},
|
||||||
}, 10
|
};
|
||||||
);
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
self.close();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
Alertify.filterDialog(title).resizeTo('65%', '60%');
|
|
||||||
});
|
});
|
||||||
},
|
|
||||||
};
|
Alertify.filterDialog(title).resizeTo('65%', '60%');
|
||||||
return FilterDialog;
|
});
|
||||||
});
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
module.exports = FilterDialog;
|
||||||
|
|||||||
@@ -1,133 +1,132 @@
|
|||||||
define([
|
import gettext from 'sources/gettext';
|
||||||
'sources/gettext', 'underscore', 'sources/pgadmin',
|
import _ from 'underscore';
|
||||||
'pgadmin.backform', 'pgadmin.backgrid',
|
import pgAdmin from 'sources/pgadmin';
|
||||||
], function(
|
import Backgrid from 'pgadmin.backgrid';
|
||||||
gettext, _, pgAdmin, Backform, Backgrid
|
import Backform from 'pgadmin.backform';
|
||||||
) {
|
|
||||||
|
|
||||||
let initModel = function(response) {
|
let initModel = function(response) {
|
||||||
|
|
||||||
let order_mapping = {
|
let order_mapping = {
|
||||||
'asc': gettext('ASC'),
|
'asc': gettext('ASC'),
|
||||||
'desc': gettext('DESC'),
|
'desc': gettext('DESC'),
|
||||||
};
|
|
||||||
|
|
||||||
let DataSortingModel = pgAdmin.Browser.DataModel.extend({
|
|
||||||
idAttribute: 'name',
|
|
||||||
defaults: {
|
|
||||||
name: undefined,
|
|
||||||
order: 'asc',
|
|
||||||
},
|
|
||||||
schema: [{
|
|
||||||
id: 'name',
|
|
||||||
name: 'name',
|
|
||||||
label: gettext('Column'),
|
|
||||||
cell: 'select2',
|
|
||||||
editable: true,
|
|
||||||
cellHeaderClasses: 'width_percent_60',
|
|
||||||
headerCell: Backgrid.Extension.CustomHeaderCell,
|
|
||||||
disabled: false,
|
|
||||||
control: 'select2',
|
|
||||||
select2: {
|
|
||||||
allowClear: false,
|
|
||||||
},
|
|
||||||
options: function() {
|
|
||||||
return _.map(response.column_list, (obj) => {
|
|
||||||
return {
|
|
||||||
value: obj,
|
|
||||||
label: obj,
|
|
||||||
};
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 'order',
|
|
||||||
name: 'order',
|
|
||||||
label: gettext('Order'),
|
|
||||||
control: 'select2',
|
|
||||||
cell: 'select2',
|
|
||||||
cellHeaderClasses: 'width_percent_40',
|
|
||||||
headerCell: Backgrid.Extension.CustomHeaderCell,
|
|
||||||
editable: true,
|
|
||||||
deps: ['type'],
|
|
||||||
select2: {
|
|
||||||
allowClear: false,
|
|
||||||
},
|
|
||||||
options: function() {
|
|
||||||
return _.map(order_mapping, (val, key) => {
|
|
||||||
return {
|
|
||||||
value: key,
|
|
||||||
label: val,
|
|
||||||
};
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
validate: function() {
|
|
||||||
let msg = null;
|
|
||||||
this.errorModel.clear();
|
|
||||||
if (_.isUndefined(this.get('name')) ||
|
|
||||||
_.isNull(this.get('name')) ||
|
|
||||||
String(this.get('name')).replace(/^\s+|\s+$/g, '') == '') {
|
|
||||||
msg = gettext('Please select a column.');
|
|
||||||
this.errorModel.set('name', msg);
|
|
||||||
return msg;
|
|
||||||
} else if (_.isUndefined(this.get('order')) ||
|
|
||||||
_.isNull(this.get('order')) ||
|
|
||||||
String(this.get('order')).replace(/^\s+|\s+$/g, '') == '') {
|
|
||||||
msg = gettext('Please select the order.');
|
|
||||||
this.errorModel.set('order', msg);
|
|
||||||
return msg;
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
let FilterCollectionModel = pgAdmin.Browser.DataModel.extend({
|
|
||||||
idAttribute: 'sql',
|
|
||||||
defaults: {
|
|
||||||
sql: response.sql || null,
|
|
||||||
},
|
|
||||||
schema: [{
|
|
||||||
id: 'sql',
|
|
||||||
label: gettext('SQL Filter'),
|
|
||||||
cell: 'string',
|
|
||||||
type: 'text', mode: ['create'],
|
|
||||||
control: Backform.SqlFieldControl.extend({
|
|
||||||
render: function() {
|
|
||||||
let obj = Backform.SqlFieldControl.prototype.render.apply(this, arguments);
|
|
||||||
// We need to set focus on editor after the dialog renders
|
|
||||||
setTimeout(() => {
|
|
||||||
obj.sqlCtrl.focus();
|
|
||||||
}, 1000);
|
|
||||||
return obj;
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
extraClasses:['custom_height_css_class'],
|
|
||||||
},{
|
|
||||||
id: 'data_sorting',
|
|
||||||
name: 'data_sorting',
|
|
||||||
label: gettext('Data Sorting'),
|
|
||||||
model: DataSortingModel,
|
|
||||||
editable: true,
|
|
||||||
type: 'collection',
|
|
||||||
mode: ['create'],
|
|
||||||
control: 'unique-col-collection',
|
|
||||||
uniqueCol: ['name'],
|
|
||||||
canAdd: true,
|
|
||||||
canEdit: false,
|
|
||||||
canDelete: true,
|
|
||||||
visible: true,
|
|
||||||
version_compatible: true,
|
|
||||||
}],
|
|
||||||
validate: function() {
|
|
||||||
return null;
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
let model = new FilterCollectionModel();
|
|
||||||
return model;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
return initModel;
|
let DataSortingModel = pgAdmin.Browser.DataModel.extend({
|
||||||
});
|
idAttribute: 'name',
|
||||||
|
defaults: {
|
||||||
|
name: undefined,
|
||||||
|
order: 'asc',
|
||||||
|
},
|
||||||
|
schema: [{
|
||||||
|
id: 'name',
|
||||||
|
name: 'name',
|
||||||
|
label: gettext('Column'),
|
||||||
|
cell: 'select2',
|
||||||
|
editable: true,
|
||||||
|
cellHeaderClasses: 'width_percent_60',
|
||||||
|
headerCell: Backgrid.Extension.CustomHeaderCell,
|
||||||
|
disabled: false,
|
||||||
|
control: 'select2',
|
||||||
|
select2: {
|
||||||
|
allowClear: false,
|
||||||
|
},
|
||||||
|
options: function() {
|
||||||
|
return _.map(response.column_list, (obj) => {
|
||||||
|
return {
|
||||||
|
value: obj,
|
||||||
|
label: obj,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'order',
|
||||||
|
name: 'order',
|
||||||
|
label: gettext('Order'),
|
||||||
|
control: 'select2',
|
||||||
|
cell: 'select2',
|
||||||
|
cellHeaderClasses: 'width_percent_40',
|
||||||
|
headerCell: Backgrid.Extension.CustomHeaderCell,
|
||||||
|
editable: true,
|
||||||
|
deps: ['type'],
|
||||||
|
select2: {
|
||||||
|
allowClear: false,
|
||||||
|
},
|
||||||
|
options: function() {
|
||||||
|
return _.map(order_mapping, (val, key) => {
|
||||||
|
return {
|
||||||
|
value: key,
|
||||||
|
label: val,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
validate: function() {
|
||||||
|
let msg = null;
|
||||||
|
this.errorModel.clear();
|
||||||
|
if (_.isUndefined(this.get('name')) ||
|
||||||
|
_.isNull(this.get('name')) ||
|
||||||
|
String(this.get('name')).replace(/^\s+|\s+$/g, '') == '') {
|
||||||
|
msg = gettext('Please select a column.');
|
||||||
|
this.errorModel.set('name', msg);
|
||||||
|
return msg;
|
||||||
|
} else if (_.isUndefined(this.get('order')) ||
|
||||||
|
_.isNull(this.get('order')) ||
|
||||||
|
String(this.get('order')).replace(/^\s+|\s+$/g, '') == '') {
|
||||||
|
msg = gettext('Please select the order.');
|
||||||
|
this.errorModel.set('order', msg);
|
||||||
|
return msg;
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
let FilterCollectionModel = pgAdmin.Browser.DataModel.extend({
|
||||||
|
idAttribute: 'sql',
|
||||||
|
defaults: {
|
||||||
|
sql: response.sql || null,
|
||||||
|
},
|
||||||
|
schema: [{
|
||||||
|
id: 'sql',
|
||||||
|
label: gettext('SQL Filter'),
|
||||||
|
cell: 'string',
|
||||||
|
type: 'text', mode: ['create'],
|
||||||
|
control: Backform.SqlFieldControl.extend({
|
||||||
|
render: function() {
|
||||||
|
let obj = Backform.SqlFieldControl.prototype.render.apply(this, arguments);
|
||||||
|
// We need to set focus on editor after the dialog renders
|
||||||
|
setTimeout(() => {
|
||||||
|
obj.sqlCtrl.focus();
|
||||||
|
}, 1000);
|
||||||
|
return obj;
|
||||||
|
},
|
||||||
|
}),
|
||||||
|
extraClasses:['custom_height_css_class'],
|
||||||
|
},{
|
||||||
|
id: 'data_sorting',
|
||||||
|
name: 'data_sorting',
|
||||||
|
label: gettext('Data Sorting'),
|
||||||
|
model: DataSortingModel,
|
||||||
|
editable: true,
|
||||||
|
type: 'collection',
|
||||||
|
mode: ['create'],
|
||||||
|
control: 'unique-col-collection',
|
||||||
|
uniqueCol: ['name'],
|
||||||
|
canAdd: true,
|
||||||
|
canEdit: false,
|
||||||
|
canDelete: true,
|
||||||
|
visible: true,
|
||||||
|
version_compatible: true,
|
||||||
|
}],
|
||||||
|
validate: function() {
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
let model = new FilterCollectionModel();
|
||||||
|
return model;
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
module.exports = initModel;
|
||||||
|
|||||||
Reference in New Issue
Block a user