118 lines
3.0 KiB
JavaScript
118 lines
3.0 KiB
JavaScript
const $ = require('jquery');
|
|
const _ = require('underscore');
|
|
const Backbone = require('backbone');
|
|
const CoreView = require('backbone/core-view');
|
|
const PagesSubheader = require('dashboard/components/pages-subheader/pages-subheader.js');
|
|
const AccountFormView = require('./account-form-view');
|
|
const ModalsServiceModel = require('builder/components/modals/modals-service-model');
|
|
const template = require('./account-content.tpl');
|
|
const checkAndBuildOpts = require('builder/helpers/required-opts');
|
|
|
|
const REQUIRED_OPTS = [
|
|
'userModel',
|
|
'configModel',
|
|
'flashMessageModel',
|
|
'client'
|
|
];
|
|
|
|
module.exports = CoreView.extend({
|
|
initialize: function (options) {
|
|
checkAndBuildOpts(options, REQUIRED_OPTS, this);
|
|
|
|
this._initModels();
|
|
this._initBinds();
|
|
},
|
|
|
|
_initBinds: function () {
|
|
this.listenTo(this.model, 'change:isLoading change:errors', this.render);
|
|
},
|
|
|
|
render: function () {
|
|
this.clearSubViews();
|
|
this.$el.html(template());
|
|
this._initViews();
|
|
return this;
|
|
},
|
|
|
|
_initModels: function () {
|
|
this.model = new Backbone.Model();
|
|
this.modals = new ModalsServiceModel();
|
|
},
|
|
|
|
_initViews: function () {
|
|
const pagesSubheader = new PagesSubheader({
|
|
userModel: this._userModel,
|
|
configModel: this._configModel
|
|
});
|
|
this.$('.js-SideMenu').append(pagesSubheader.render().el);
|
|
this.addView(pagesSubheader);
|
|
|
|
const accountFormView = new AccountFormView({
|
|
userModel: this._userModel,
|
|
renderModel: this.model,
|
|
configModel: this._configModel,
|
|
modals: this.modals,
|
|
setLoading: this._setLoading.bind(this),
|
|
onSuccess: this._showSuccess.bind(this),
|
|
onError: this._showErrors.bind(this),
|
|
client: this._client,
|
|
errors: this.model.get('errors')
|
|
});
|
|
|
|
this.$('.js-AccountContent').append(accountFormView.render().el);
|
|
this.addView(accountFormView);
|
|
},
|
|
|
|
_setLoading: function (message) {
|
|
this._flashMessageModel.hide();
|
|
|
|
this.model.set({
|
|
isLoading: !!message,
|
|
loadingText: message,
|
|
errors: []
|
|
});
|
|
},
|
|
|
|
_setFlashMessage: function (data, message, type) {
|
|
this._setLoading('');
|
|
|
|
const jsonData = data && data.responseJSON || {};
|
|
const errors = jsonData.errors;
|
|
let flashMessage = jsonData.message;
|
|
|
|
if (errors) {
|
|
this.model.set({ errors });
|
|
}
|
|
|
|
if (!flashMessage) {
|
|
flashMessage = message;
|
|
}
|
|
|
|
this._flashMessageModel.show(flashMessage, type);
|
|
},
|
|
|
|
_showSuccess: function (data) {
|
|
$(window).scrollTop(0);
|
|
|
|
_.extend(
|
|
this._userModel.attributes,
|
|
data.user_data
|
|
);
|
|
|
|
this._setFlashMessage(data, _t('account.flash_messages.save_changes.success'), 'success');
|
|
|
|
if (data.mfa_required) {
|
|
this._goToMultifactorAuthentication();
|
|
}
|
|
},
|
|
|
|
_goToMultifactorAuthentication: function () {
|
|
window.location = '/multifactor_authentication';
|
|
},
|
|
|
|
_showErrors: function (data) {
|
|
$(window).scrollTop(0);
|
|
this._setFlashMessage(data, _t('account.flash_messages.save_changes.error'), 'error');
|
|
}
|
|
});
|