[REF] website_slides: remove usage of legacy dialog to enroll

The Dialog widget is deprecated and will soon be removed, this commit
converts the usage of this dialog for the enroll buttons to use the new
dialog service.

To avoid duplicating the opening logic in the Quiz code, the selector of
the widget that opens the dialog now targets the #wrapwrap and uses
event delegation for the button, avoiding the need to manually spawn the
dialog for buttons added to the DOM after the first load.

closes odoo/odoo#135476

Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
This commit is contained in:
Samuel Degueldre
2023-09-18 10:14:07 +00:00
parent 66e8e65682
commit 4aaee61a5f
3 changed files with 31 additions and 92 deletions
@@ -1,78 +1,40 @@
/** @odoo-module **/
import { ConfirmationDialog } from "@web/core/confirmation_dialog/confirmation_dialog";
import { _t } from "@web/core/l10n/translation";
import Dialog from '@web/legacy/js/core/dialog';
import publicWidget from '@web/legacy/js/public/public_widget';
import { escape } from "@web/core/utils/strings";
import publicWidget from "@web/legacy/js/public/public_widget";
var SlideEnrollDialog = Dialog.extend({
template: 'slide.course.join.request',
init: function (parent, options, modalOptions) {
modalOptions = Object.assign({
title: _t('Request Access.'),
size: 'medium',
buttons: [{
text: _t('Yes'),
classes: 'btn-primary',
click: this._onSendRequest.bind(this)
}, {
text: _t('Cancel'),
close: true
}]
}, modalOptions || {});
this.$element = options.$element;
this.channelId = options.channelId;
this._super(parent, modalOptions);
},
_onSendRequest: function () {
var self = this;
this._rpc({
model: 'slide.channel',
method: 'action_request_access',
args: [self.channelId]
}).then(function (result) {
if (result.error) {
self.$element.replaceWith('<div class="alert alert-danger" role="alert"><strong>' + result.error + '</strong></div>');
} else if (result.done) {
self.$element.replaceWith('<div class="alert alert-success" role="alert"><strong>' + _t('Request sent!') + '</strong></div>');
} else {
self.$element.replaceWith('<div class="alert alert-danger" role="alert"><strong>' + _t('Unknown error, try again.') + '</strong></div>');
}
self.close();
});
}
});
publicWidget.registry.websiteSlidesEnroll = publicWidget.Widget.extend({
selector: '.o_wslides_js_channel_enroll',
export const WebsiteSlidesEnroll = publicWidget.Widget.extend({
selector: "#wrapwrap",
events: {
'click': '_onSendRequestClick',
"click .o_wslides_js_channel_enroll": "_onSendRequestClick",
},
//--------------------------------------------------------------------------
// Private
//--------------------------------------------------------------------------
_openDialog: function (channelId) {
new SlideEnrollDialog(this, {
channelId: channelId,
$element: this.$el.closest('.alert')
}).open();
},
//--------------------------------------------------------------------------
// Handlers
//--------------------------------------------------------------------------
_onSendRequestClick: function (ev) {
async _onSendRequestClick(ev) {
ev.preventDefault();
this._openDialog($(ev.currentTarget).data('channelId'));
}
const clickedEl = ev.currentTarget;
const channelId = parseInt(clickedEl.dataset.channelId);
await new Promise((resolve) =>
this.call("dialog", "add", ConfirmationDialog, {
confirm: resolve,
title: _t("Request Access."),
body: _t("Do you want to request access to this course?"),
confirmLabel: _t("Yes"),
cancel: () => {}, // show cancel button
})
);
const { error, done } = await this._rpc({
model: "slide.channel",
method: "action_request_access",
args: [channelId],
});
const $alert = $(clickedEl.closest(".alert"));
const message = done ? _t("Request sent!") : error || _t("Unknown error, try again.");
$alert.replaceWith(`
<div class="alert alert-${done ? "success" : "danger"}" role="alert">
<strong>${escape(message)}</strong>
</div>`);
},
});
export default {
slideEnrollDialog: SlideEnrollDialog,
websiteSlidesEnroll: publicWidget.registry.websiteSlidesEnroll
};
publicWidget.registry.WebsiteSlidesEnroll = WebsiteSlidesEnroll;
@@ -9,13 +9,11 @@
import SlideQuizFinishModal from '@website_slides/js/slides_course_quiz_finish';
import { SlideCoursePage } from '@website_slides/js/slides_course_page';
import SlideEnroll from '@website_slides/js/slides_course_enroll_email';
import { _t } from "@web/core/l10n/translation";
import { markup } from "@odoo/owl";
const CourseJoinWidget = CourseJoin.courseJoinWidget;
const SlideEnrollDialog = SlideEnroll.slideEnrollDialog;
/**
* This widget is responsible of displaying quiz questions and propositions. Submitting the quiz will fetch the
@@ -39,7 +37,6 @@
'click .o_wslides_js_quiz_add': '_onCreateQuizClick',
'click .o_wslides_js_quiz_edit_question': '_onEditQuestionClick',
'click .o_wslides_js_quiz_delete_question': '_onDeleteQuestionClick',
'click .o_wslides_js_channel_enroll': '_onSendRequestToResponsibleClick',
},
custom_events: {
@@ -559,20 +556,6 @@
}).open();
},
/**
* Handler for the contact responsible link below a Quiz
* @param ev
* @private
*/
_onSendRequestToResponsibleClick: function(ev) {
ev.preventDefault();
var channelId = $(ev.currentTarget).data('channelId');
new SlideEnrollDialog(this, {
channelId: channelId,
$element: $(ev.currentTarget).closest('.alert.alert-info')
}).open();
},
/**
* Displays the created Question at the correct place (after the last question or
* at the first place if there is no questions yet) It also displays the 'Add Question'
@@ -27,10 +27,4 @@
</t>
</t>
</t>
<t t-name="slide.course.join.request">
<div>
<p>Do you want to request access to this course?</p>
</div>
</t>
</templates>