cartodb/lib/assets/javascripts/dashboard/components/table-grants/table-grants-view.js
2020-06-15 10:58:47 +08:00

126 lines
3.4 KiB
JavaScript

const _ = require('underscore');
const Backbone = require('backbone');
const CoreView = require('backbone/core-view');
const checkAndBuildOpts = require('builder/helpers/required-opts');
const template = require('./table-grants.tpl');
const formTemplate = require('./table-grants-form.tpl');
const itemTemplate = require('./table-grants-item.tpl');
const loadingTemplate = require('./table-grants-loader.tpl');
const placeholderTemplate = require('./table-grants-placeholder.tpl');
const REQUIRED_OPTS = [
'apiKeyModel',
'userTablesModel'
];
module.exports = CoreView.extend({
className: 'ApiKeysForm-grantsTable',
events: {
'input .js-search': '_onSearchChanged'
},
initialize: function (options) {
checkAndBuildOpts(options, REQUIRED_OPTS, this);
if (this._apiKeyModel.isPublic()) {
this._userTablesModel.fetchPublicDatasets();
}
this._initBinds();
},
render: function () {
this.$el.html(template({
showSearch: !this._apiKeyModel.id
}));
this._renderFormView();
return this;
},
_initBinds: function () {
this.listenTo(this._userTablesModel.getStateModel(), 'change:status', this._renderFormView);
},
_renderFormView: function () {
this._formView && this._formView.off('change', this._onFormViewChanged, this);
let view = loadingTemplate();
if (this._userTablesModel.isFetched()) {
if (this._userTablesModel.isEmpty()) {
const message = this._userTablesModel.hasQuery() ? '0 datasets found' : 'There are no datasets';
view = placeholderTemplate({ message });
} else {
view = this._createFormView().render().el;
}
}
this.$('.js-datasets-list').html(view);
},
_createFormView: function () {
const tables = this._getTables();
const multiCheckbox = {
type: 'MultiCheckbox',
title: false,
inputs: [
{ name: 'select', label: 'Select' },
{ name: 'insert', label: 'Insert' },
{ name: 'update', label: 'Update' },
{ name: 'delete', label: 'Delete' }
],
editorAttrs: {
disabled: !!this._apiKeyModel.id
}
};
const schema = _.mapObject(tables, () => multiCheckbox);
const data = _.mapObject(tables, (value, tableName) => {
const apiKeyTables = this._apiKeyModel.get('tables');
if (apiKeyTables.hasOwnProperty(tableName) && apiKeyTables[tableName]) {
return apiKeyTables[tableName].permissions;
}
return value.permissions;
});
this._formView = new Backbone.Form({ data, schema, template: this._generateFormMarkup });
this._formView.on('change', this._onFormViewChanged, this);
return this._formView;
},
_generateFormMarkup: function () {
const rows = Object.keys(this.data).map((tableName) => itemTemplate({ tableName })).join('');
return formTemplate({ rows });
},
_getTables: function () {
return !this._apiKeyModel.id || this._apiKeyModel.isPublic()
? this._userTablesModel.attributes
: this._apiKeyModel.get('tables');
},
_onFormViewChanged: function (form) {
const persistedTables = this._apiKeyModel.get('tables');
const formTables = _.mapObject(form.getValue(), (value, key) => ({ permissions: value }));
this._apiKeyModel.set({
tables: {
...persistedTables,
...formTables
}
});
},
_onSearchChanged: _.debounce(function (event) {
this._userTablesModel.setQuery(event.target.value);
}, 500, this)
});