From 67d9eafd2eede6895e5bc8af6314cdc521ef4f6d Mon Sep 17 00:00:00 2001 From: fja-odoo Date: Thu, 6 Feb 2020 12:42:52 +0000 Subject: [PATCH] [FIX] website_form, *: fix new website form * = website_crm, website_hr_recruitment, website_sale Changing label position on existing field was replacing the label with the default one. Redirection message was not updating the overlay Going from show message to redirect without hidding the mesage made the form d-none When a select field's label's position was changed the select was not editable anymore. Some other miscellaneous fixes task-2191409 closes odoo/odoo#44911 X-original-commit: 3cf87cc1cb179598cecb736728378e330d3b2e22 Signed-off-by: Quentin Smetz (qsm) --- .../views/website_crm_templates.xml | 128 +++++++------- .../src/js/website_form_editor_registry.js | 1 + .../src/snippets/s_website_form/options.js | 163 ++++++++++-------- .../static/src/xml/website_form_editor.xml | 60 ++++--- .../static/tests/tours/website_form_editor.js | 24 +-- .../views/snippets/s_website_form.xml | 4 +- .../views/website_form_templates.xml | 16 +- .../website_hr_recruitment_templates.xml | 142 +++++++-------- addons/website_sale/views/templates.xml | 6 +- 9 files changed, 290 insertions(+), 254 deletions(-) diff --git a/addons/website_crm/views/website_crm_templates.xml b/addons/website_crm/views/website_crm_templates.xml index 2366a67a114..b32f87af001 100644 --- a/addons/website_crm/views/website_crm_templates.xml +++ b/addons/website_crm/views/website_crm_templates.xml @@ -11,72 +11,74 @@ 'description': request.params.get('description', ''), } - -
-
-
-
-
-
- -
- + +
+
+
+ +
+
+
+ +
+ +
+
+
+
+
+ +
+ +
+
+
+
+
+ +
+ +
+
+
+
+
+ +
+ +
+
+
+
+
+ +
+ +
+
+
+
+
+ +
+ +
+
+
+
+
+
+
+ Submit + +
-
-
- -
- -
-
-
-
-
- -
- -
-
-
-
-
- -
- -
-
-
-
-
- -
- -
-
-
-
-
- -
- -
-
-
-
-
-
-
- Submit - -
-
-
-
- -
-
+ +
+
+ diff --git a/addons/website_form/static/src/js/website_form_editor_registry.js b/addons/website_form/static/src/js/website_form_editor_registry.js index 93b183a9be8..82c5f500fab 100644 --- a/addons/website_form/static/src/js/website_form_editor_registry.js +++ b/addons/website_form/static/src/js/website_form_editor_registry.js @@ -50,6 +50,7 @@ FormEditorRegistry.add('send_mail', { type: 'char', required: true, string: _t('Recipient Email'), + defaultValue: 'info@yourcompany.example.com', }], }); diff --git a/addons/website_form/static/src/snippets/s_website_form/options.js b/addons/website_form/static/src/snippets/s_website_form/options.js index 2e9e48930d2..4bd19093345 100644 --- a/addons/website_form/static/src/snippets/s_website_form/options.js +++ b/addons/website_form/static/src/snippets/s_website_form/options.js @@ -28,8 +28,19 @@ const FormEditor = options.Class.extend({ // in qweb js to avoid duplicating this in the templates field.required = field.required ? 1 : null; - // Fetch possible values for relation fields - if (!field.records && field.relation && field.relation !== 'ir.attachment') { + if (field.records) { + return field.records; + } + // Set selection as records to avoid added conplexity + if (field.type === 'selection') { + field.records = []; + field.selection.forEach(el => { + field.records.push({ + id: el[0], + display_name: el[1], + }); + }); + } else if (field.relation && field.relation !== 'ir.attachment') { field.records = await this._rpc({ model: field.relation, method: 'search_read', @@ -55,7 +66,7 @@ const FormEditor = options.Class.extend({ string: name, custom: true, type: type, - // Default values for x2many fields + // Default values for x2many fields and selection records: [{ id: _t('Option 1'), display_name: _t('Option 1'), @@ -66,17 +77,6 @@ const FormEditor = options.Class.extend({ id: _t('Option 3'), display_name: _t('Option 3'), }], - // Default values for selection fields - selection: [[ - _t('Option 1'), - _t('Option 1'), - ], [ - _t('Option 2'), - _t('Option 2'), - ], [ - _t('Option 3'), - _t('Option 3'), - ]], }; }, /** @@ -116,7 +116,6 @@ const FormEditor = options.Class.extend({ */ _isRequiredMark: function () { return this.$target[0].classList.contains('o_mark_required'); - }, /** * @private @@ -152,12 +151,14 @@ const FieldEditor = FormEditor.extend({ */ _getActiveField: function () { let field; + const labelText = this.$target.find('.s_website_form_label_content').text(); if (this._isFieldCustom()) { - const name = this.$target[0].querySelector('.s_website_form_label').firstChild.textContent.trim(); - field = this._getCustomField(this.$target[0].dataset.type, name); + field = this._getCustomField(this.$target[0].dataset.type, labelText); } else { field = this.fields[this._getFieldName()]; + field.string = labelText; } + field.records = this._getListItems(); this._setActiveProperties(field); return field; }, @@ -170,7 +171,7 @@ const FieldEditor = FormEditor.extend({ */ _getFieldFormat: function () { let requiredMark, optionalMark; - const mark = this.$target[0].querySelector('span.s_website_form_mark'); + const mark = this.$target[0].querySelector('.s_website_form_mark'); if (mark) { requiredMark = this._isFieldRequired(); optionalMark = !requiredMark; @@ -270,7 +271,8 @@ const FieldEditor = FormEditor.extend({ */ _setActiveProperties(field) { field.placeholder = this._getPlaceholder(); - field.required = this._isFieldRequired(); + field.required = this.$target[0].classList.contains('s_website_form_required'); + field.modelRequired = this.$target[0].classList.contains('s_website_form_model_required'); field.hidden = this.$target[0].classList.contains('s_website_form_field_hidden'); field.formatInfo = this._getFieldFormat(); }, @@ -361,7 +363,7 @@ options.registry.WebsiteFormEditor = FormEditor.extend({ if (model) { // we may be re-whitelisting already whitelisted fields. Doesn't // really matter. - const fields = [...this.$target[0].querySelectorAll('.s_website_form_field:not(.s_website_form_custom) input')].map(el => el.name); + const fields = [...this.$target[0].querySelectorAll('.s_website_form_field:not(.s_website_form_custom) .s_website_form_input')].map(el => el.name); if (fields.length) { // ideally we'd only do this if saving the form // succeeds... but no idea how to do that @@ -399,6 +401,7 @@ options.registry.WebsiteFormEditor = FormEditor.extend({ updateUIEndMessage: function () { this.$target.toggleClass("d-none", this.showEndMessage); this.$message.toggleClass("d-none", !this.showEndMessage); + this.$el.find(".toggle-edit-message").toggleClass('text-primary', this.showEndMessage); }, /** * @override @@ -430,20 +433,11 @@ options.registry.WebsiteFormEditor = FormEditor.extend({ * ie: The Job you apply for if the form is on that job's page. */ addActionField: function (previewMode, value, params) { - let fieldName = params.fieldName; + const fieldName = params.fieldName; if (params.isSelect === 'true') { value = parseInt(value); } - this.$target.find(`.s_website_form_field.d-none:has(input[name="${params.fieldName}"])`).remove(); - if (value) { - const hiddenField = qweb.render('website_form.field_hidden', { - field: { - name: fieldName, - value: value, - }, - }); - this.$target.find('.s_website_form_submit').before(hiddenField); - } + this.addHiddenField(value, fieldName); }, /** * Changes the onSuccess event. @@ -456,6 +450,7 @@ options.registry.WebsiteFormEditor = FormEditor.extend({ } this.$target.after(this.$message); } else { + this.showEndMessage = false; this.$message.remove(); } }, @@ -541,11 +536,33 @@ options.registry.WebsiteFormEditor = FormEditor.extend({ option = this._buildInput(field); break; } + if (field.required) { + // Get default value or for many2one fields the first option. + const defaultValue = field.defaultValue || field.records[0].id; + this.addHiddenField(defaultValue, field.name); + } uiFragment.insertBefore(option, firstOption); }); }); }, - + /** + * Add a hidden field to the form + * + * @param {string} value + * @param {string} fieldName + */ + addHiddenField: function (value, fieldName) { + this.$target.find(`.s_website_form_field.d-none:has(input[name="${fieldName}"])`).remove(); + if (value) { + const hiddenField = qweb.render('website_form.field_hidden', { + field: { + name: fieldName, + value: value, + }, + }); + this.$target.find('.s_website_form_submit').before(hiddenField); + } + }, /** * Returns a we-input element from the field * @@ -574,10 +591,12 @@ options.registry.WebsiteFormEditor = FormEditor.extend({ selectEl.dataset.fieldName = field.name; selectEl.dataset.isSelect = 'true'; selectEl.setAttribute('string', field.string); - const noneButton = document.createElement('we-button'); - noneButton.textContent = 'None'; - noneButton.dataset.addActionField = 0; - selectEl.append(noneButton); + if (!field.required) { + const noneButton = document.createElement('we-button'); + noneButton.textContent = 'None'; + noneButton.dataset.addActionField = 0; + selectEl.append(noneButton); + } field.records.forEach(el => { const button = document.createElement('we-button'); button.textContent = el.display_name; @@ -634,7 +653,7 @@ options.registry.WebsiteFormEditor = FormEditor.extend({ * @private */ _setLabelsMark: function () { - this.$target[0].querySelectorAll('span.s_website_form_mark').forEach(el => el.remove()); + this.$target[0].querySelectorAll('.s_website_form_mark').forEach(el => el.remove()); const mark = this._getMark(); if (!mark) { return; @@ -664,8 +683,10 @@ options.registry.WebsiteFormEditor = FormEditor.extend({ */ _onToggleEndMessageClick: function () { this.showEndMessage = !this.showEndMessage; - this.$el.find(".toggle-edit-message").toggleClass('text-primary', this.showEndMessage); this.updateUIEndMessage(); + this.trigger_up('activate_snippet', { + $snippet: this.showEndMessage ? this.$message : this.$target, + }); }, }); @@ -794,7 +815,7 @@ options.registry.WebsiteFieldEditor = FieldEditor.extend({ * Set the name of the field on the label */ setLabelText: function (previewMode, value, params) { - this.$target[0].querySelector('.s_website_form_label').firstChild.textContent = value; + this.$target.find('.s_website_form_label_content').text(value); if (this._isFieldCustom()) { const multiple = this.$target[0].querySelector('.s_website_form_multiple'); if (multiple) { @@ -816,7 +837,7 @@ options.registry.WebsiteFieldEditor = FieldEditor.extend({ const field = this._getActiveField(); field.formatInfo.labelPosition = value; await this._replaceField(field); - this._renderListItems(); + this.rerender = true; }, /** * Select the display of the multicheckbox field (vertical & horizontal) @@ -859,7 +880,7 @@ options.registry.WebsiteFieldEditor = FieldEditor.extend({ case 'existingField': return this._isFieldCustom() ? '' : this._getFieldName(); case 'setLabelText': - return this.$target[0].querySelector('.s_website_form_label').firstChild.textContent.trim(); + return this.$target.find('.s_website_form_label_content').text(); case 'setPlaceholder': return this._getPlaceholder(); case 'selectLabelPosition': @@ -943,7 +964,7 @@ options.registry.WebsiteFieldEditor = FieldEditor.extend({ listTitle = multipleInputs.querySelector('.radio') ? 'Radio List' : 'Checkbox List'; addItemTitle = 'Add new Checkbox'; multipleInputs.querySelectorAll('.checkbox, .radio').forEach(opt => { - this._addItemToTable(opt.querySelector('input').value, opt.querySelector('span').textContent.trim()); + this._addItemToTable(opt.querySelector('input').value, opt.querySelector('.s_website_form_check_label').textContent.trim()); }); } else { return; @@ -988,18 +1009,11 @@ options.registry.WebsiteFieldEditor = FieldEditor.extend({ selectMenu.innerHTML = ''; const field = this.fields[this._getFieldName()]; this._fetchFieldRecords(field).then(() => { - let buttonItems, availableRecords; - if (field.selection) { - availableRecords = field.selection.map(el => { - return {id: el[0], display_name: el[1]}; - }); - } else if (field.records) { - availableRecords = field.records; - } + let buttonItems; const optionIds = Array.from(this.listTable.querySelectorAll('input')).map(opt => { return field.type === 'selection' ? opt.name : parseInt(opt.name); }); - availableRecords = (availableRecords || []).filter(el => !optionIds.includes(el.id)); + const availableRecords = (field.records || []).filter(el => !optionIds.includes(el.id)); if (availableRecords.length) { buttonItems = availableRecords.map(el => { const option = document.createElement('we-button'); @@ -1079,31 +1093,22 @@ options.registry.WebsiteFieldEditor = FieldEditor.extend({ _renderListItems: function () { const multiInputsWrap = this._getMultipleInputs(); const selectWrap = this.$target[0].querySelector('#editable_select'); - const isCustomField = this._isFieldCustom(); const isRequiredField = this._isFieldRequired(); const name = this._getFieldName(); if (multiInputsWrap) { const type = multiInputsWrap.querySelector('.radio') ? 'radio' : 'checkbox'; multiInputsWrap.innerHTML = ''; - this.listTable.querySelectorAll('input').forEach(el => { - const params = { - field: { - name: name, - required: isRequiredField, - formatInfo: { - multiPosition: multiInputsWrap.dataset.display, - } + const params = { + field: { + name: name, + required: isRequiredField, + formatInfo: { + multiPosition: multiInputsWrap.dataset.display, } - }; - const id = isCustomField ? el.value : el.name; - if (type === 'radio') { - params.record = [id, el.value]; - } else { - params.record = { - id: id, - display_name: el.value, - }; } + }; + this._getListItems().forEach(record => { + params.record = record; const template = document.createElement('template'); template.innerHTML = qweb.render(`website_form.${type}`, params); multiInputsWrap.appendChild(template.content.firstElementChild); @@ -1119,6 +1124,26 @@ options.registry.WebsiteFieldEditor = FieldEditor.extend({ }); } }, + /** + * Returns an array based on the we-list containing the field's records + * + * @returns {Array} + */ + _getListItems: function () { + if (!this.listTable) { + return null; + } + const isCustomField = this._isFieldCustom(); + const records = []; + this.listTable.querySelectorAll('input').forEach(el => { + const id = isCustomField ? el.value : el.name; + records.push({ + id: id, + display_name: el.value, + }); + }); + return records; + }, /** * Returns the select element if it exist else null * diff --git a/addons/website_form/static/src/xml/website_form_editor.xml b/addons/website_form/static/src/xml/website_form_editor.xml index 70c90f55593..f191edc8f39 100644 --- a/addons/website_form/static/src/xml/website_form_editor.xml +++ b/addons/website_form/static/src/xml/website_form_editor.xml @@ -26,9 +26,9 @@
+ data-name="Field">
-