diff options
9 files changed, 264 insertions, 228 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', ''), }</attribute> </xpath> - <xpath expr="//section[@id='contactus_section']" position="replace"> - <section class="s_website_form" data-vcss="001"> - <div class="container"> - <form id="contactus_form" action="/website_form/" method="post" enctype="multipart/form-data" data-model_name="crm.lead" data-success-mode="redirect" data-success-page="/contactus-thank-you" class="o_mark_required" data-mark="*" data-editable-form="false"> - <div class="s_website_form_rows row s_col_no_bgcolor"> - <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="char"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity1">Your Name<span class="s_website_form_mark"> *</span></label> - <div class="col-sm"> - <input id="opportunity1" type="text" class="form-control s_website_form_input" name="contact_name" required=""/> + <xpath expr="//div[@id='contactus_section']" position="replace"> + <div id="contactus_section"> + <section class="s_website_form" data-vcss="001"> + <div class="container"> + <form id="contactus_form" action="/website_form/" method="post" enctype="multipart/form-data" data-model_name="crm.lead" data-success-mode="redirect" data-success-page="/contactus-thank-you" class="o_mark_required" data-mark="*" data-editable-form="false"> + <div class="s_website_form_rows row s_col_no_bgcolor"> + <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="char" data-name="Field"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity1">Your Name<span class="s_website_form_mark"> *</span></label> + <div class="col-sm"> + <input id="opportunity1" type="text" class="form-control s_website_form_input" name="contact_name" required=""/> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_field" data-type="char"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity2">Phone Number</label> - <div class="col-sm"> - <input id="opportunity2" type="text" class="form-control s_website_form_input" name="phone" /> + <div class="form-group col-12 s_website_form_field" data-type="char" data-name="Field"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity2">Phone Number</label> + <div class="col-sm"> + <input id="opportunity2" type="text" class="form-control s_website_form_input" name="phone" /> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="char"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity3">Email<span class="s_website_form_mark"> *</span></label> - <div class="col-sm"> - <input id="opportunity3" type="text" class="form-control s_website_form_input" name="email_from" required="" /> + <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="char" data-name="Field"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity3">Email<span class="s_website_form_mark"> *</span></label> + <div class="col-sm"> + <input id="opportunity3" type="text" class="form-control s_website_form_input" name="email_from" required="" /> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_field" data-type="char"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity4">Your Company</label> - <div class="col-sm"> - <input id="opportunity4" type="text" class="form-control s_website_form_input" name="partner_name" /> + <div class="form-group col-12 s_website_form_field" data-type="char" data-name="Field"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity4">Your Company</label> + <div class="col-sm"> + <input id="opportunity4" type="text" class="form-control s_website_form_input" name="partner_name" /> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_field s_website_form_model_required" data-type="char"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity5">Subject</label> - <div class="col-sm"> - <input id="opportunity5" type="text" class="form-control s_website_form_input" name="name" required="" /> + <div class="form-group col-12 s_website_form_field s_website_form_model_required" data-type="char" data-name="Field"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity5">Subject</label> + <div class="col-sm"> + <input id="opportunity5" type="text" class="form-control s_website_form_input" name="name" required="" /> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="text"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity6">Your Question<span class="s_website_form_mark"> *</span></label> - <div class="col-sm"> - <textarea id="opportunity6" class="form-control s_website_form_input" name="description" required=""></textarea> + <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="text" data-name="Field"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="opportunity6">Your Question<span class="s_website_form_mark"> *</span></label> + <div class="col-sm"> + <textarea id="opportunity6" class="form-control s_website_form_input" name="description" required=""></textarea> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_submit"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <div style="width: 200px" class="col-sm-auto s_website_form_label"/> - <div class="col-sm"> - <a href="#" role="button" class="btn btn-primary btn-lg s_website_form_send">Submit</a> - <span id="s_website_form_result"></span> + <div class="form-group col-12 s_website_form_submit"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <div style="width: 200px" class="col-sm-auto s_website_form_label"/> + <div class="col-sm"> + <a href="#" role="button" class="btn btn-primary btn-lg s_website_form_send">Submit</a> + <span id="s_website_form_result"></span> + </div> </div> </div> </div> - </div> - </form> - </div> - </section> + </form> + </div> + </section> + </div> </xpath> </template> 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); @@ -1120,6 +1125,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 * * @private 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 @@ <t t-name="website_form.field"> <div t-attf-class="form-group s_website_form_field #{field.formatInfo.col or 'col-12'} #{field.custom and 's_website_form_custom' or ''} #{(field.required and 's_website_form_required' or '') or (field.modelRequired and 's_website_form_model_required' or '')} #{field.hidden and 's_website_form_field_hidden' or ''} #{field.dnone and 'd-none' or ''}" t-att-data-type="field.type" - t-att-data-name="Field"> + data-name="Field"> <div t-if="field.formatInfo.labelPosition != 'none' and field.formatInfo.labelPosition != 'top'" class="row s_col_no_resize s_col_no_bgcolor"> - <label t-attf-class="col-form-label col-sm-auto s_website_form_label #{field.formatInfo.labelPosition == 'right' and 'text-right' or ''}" t-attf-style="width: #{field.formatInfo.labelWidth or '200px'}" t-att-for="field.id"> + <label t-attf-class="#{!field.isCheck and 'col-form-label' or ''} col-sm-auto s_website_form_label #{field.formatInfo.labelPosition == 'right' and 'text-right' or ''}" t-attf-style="width: #{field.formatInfo.labelWidth or '200px'}" t-att-for="field.id"> <t t-call="website_form.label_content"/> </label> <div class="col-sm"> @@ -46,7 +46,7 @@ <t t-name="website_form.label_content"> <t t-if="field.custom" t-set="field.string" t-value="field.name"/> - <t t-esc="field.string"/> + <span class="s_website_form_label_content" t-esc="field.string"/> <t t-if="field.required or field.modelRequired"> <span class="s_website_form_mark" t-if="field.formatInfo.requiredMark" t-esc="' ' + field.formatInfo.mark"/> </t> @@ -198,25 +198,25 @@ <!-- Boolean Field --> <t t-name="website_form.field_boolean"> + <t t-set="field.isCheck" t-value="true"/> <t t-call="website_form.field"> - <div class="col-form-label"> - <input - type="checkbox" - value="Yes" - class="s_website_form_input" - t-att-name="field.name" - t-att-required="field.required || field.modelRequired || None" - t-att-id="field.id" - /> - </div> + <input + type="checkbox" + value="Yes" + class="s_website_form_input" + t-att-name="field.name" + t-att-required="field.required || field.modelRequired || None" + t-att-id="field.id" + /> </t> </t> <!-- Selection Field --> <t t-name="website_form.field_selection"> + <t t-set="field.isCheck" t-value="true"/> <t t-call="website_form.field"> <div class="row s_col_no_resize s_col_no_bgcolor s_website_form_multiple" t-att-data-name="field.name" t-att-data-display="field.formatInfo.multiPosition"> - <t t-if="!field.selection"> + <t t-if="!field.records"> <input class="s_website_form_input" t-att-name="field.name" @@ -225,7 +225,7 @@ placeholder="No matching record !" /> </t> - <t t-foreach="field.selection" t-as="record"> + <t t-foreach="field.records" t-as="record"> <t t-call="website_form.radio"/> </t> </div> @@ -234,19 +234,21 @@ <!-- Radio --> <t t-name="website_form.radio"> + <t t-set="recordId" t-value="field.id + record_index"/> <div t-attf-class="radio col-12 #{field.formatInfo.multiPosition === 'horizontal' and 'col-lg-4 col-md-6' or ''}"> - <label class="col-form-label"> + <div class="form-check"> <input type="radio" - class="s_website_form_input" + class="s_website_form_input form-check-input" + t-att-id="recordId" t-att-name="field.name" - t-att-value="record[0]" + t-att-value="record.id" t-att-required="field.required || field.modelRequired || None" /> - <span> - <t t-esc="record[1]"/> - </span> - </label> + <label class="form-check-label s_website_form_check_label" t-att-for="recordId"> + <t t-esc="record.display_name"/> + </label> + </div> </div> </t> @@ -280,6 +282,7 @@ </t> <!-- Generic one2many --> <t t-if="field.relation != 'ir.attachment'"> + <t t-set="field.isCheck" t-value="true"/> <t t-call="website_form.field"> <div class="row s_col_no_resize s_col_no_bgcolor s_website_form_multiple" t-att-data-name="field.name" t-att-data-display="field.formatInfo.multiPosition"> <t t-if="!field.records"> @@ -301,19 +304,21 @@ <!-- Checkbox --> <t t-name="website_form.checkbox"> + <t t-set="recordId" t-value="field.id + record_index"/> <div t-attf-class="checkbox col-12 #{field.formatInfo.multiPosition === 'horizontal' and 'col-lg-4 col-md-6' or ''}"> - <label class="col-form-label"> + <div class="form-check"> <input type="checkbox" - class="s_website_form_input" + class="s_website_form_input form-check-input" + t-att-id="recordId" t-att-name="field.name" t-att-value="record.id" t-att-required="field.required || field.modelRequired || None" /> - <span> + <label class="form-check-label s_website_form_check_label" t-att-for="recordId"> <t t-esc="record.display_name"/> - </span> - </label> + </label> + </div> </div> </t> @@ -324,6 +329,7 @@ <!-- Binary Field --> <t t-name="website_form.field_binary"> + <t t-set="field.isCheck" t-value="true"/> <t t-call="website_form.field"> <input type="file" diff --git a/addons/website_form/static/tests/tours/website_form_editor.js b/addons/website_form/static/tests/tours/website_form_editor.js index 60723cb4118..10ad3b996de 100644 --- a/addons/website_form/static/tests/tours/website_form_editor.js +++ b/addons/website_form/static/tests/tours/website_form_editor.js @@ -136,10 +136,10 @@ odoo.define('website_form_editor.tour', function (require) { content: "Check the resulting field", trigger: ".s_website_form_field.s_website_form_custom.s_website_form_required" + ":has(.s_website_form_multiple[data-display='horizontal'])" + - ":has(.checkbox label:contains('Iphone'):has(input[type='checkbox'][required]))" + - ":has(.checkbox label:contains('Galaxy S'):has(input[type='checkbox'][required]))" + - ":has(.checkbox label:contains('Xperia'):has(input[type='checkbox'][required]))" + - ":has(.checkbox label:contains('Wiko Stairway'):has(input[type='checkbox'][required]))", + ":has(.checkbox:has(label:contains('Iphone')):has(input[type='checkbox'][required]))" + + ":has(.checkbox:has(label:contains('Galaxy S')):has(input[type='checkbox'][required]))" + + ":has(.checkbox:has(label:contains('Xperia')):has(input[type='checkbox'][required]))" + + ":has(.checkbox:has(label:contains('Wiko Stairway')):has(input[type='checkbox'][required]))", run: function () {}, }, ...selectButtonByData('data-multi-checkbox-display="vertical"'), @@ -147,10 +147,10 @@ odoo.define('website_form_editor.tour', function (require) { content: "Check the resulting field", trigger: ".s_website_form_field.s_website_form_custom.s_website_form_required" + ":has(.s_website_form_multiple[data-display='vertical'])" + - ":has(.checkbox label:contains('Iphone'):has(input[type='checkbox'][required]))" + - ":has(.checkbox label:contains('Galaxy S'):has(input[type='checkbox'][required]))" + - ":has(.checkbox label:contains('Xperia'):has(input[type='checkbox'][required]))" + - ":has(.checkbox label:contains('Wiko Stairway'):has(input[type='checkbox'][required]))", + ":has(.checkbox:has(label:contains('Iphone')):has(input[type='checkbox'][required]))" + + ":has(.checkbox:has(label:contains('Galaxy S')):has(input[type='checkbox'][required]))" + + ":has(.checkbox:has(label:contains('Xperia')):has(input[type='checkbox'][required]))" + + ":has(.checkbox:has(label:contains('Wiko Stairway')):has(input[type='checkbox'][required]))", run: function () {}, }, @@ -180,10 +180,10 @@ odoo.define('website_form_editor.tour', function (require) { }, { content: "Check the resulting field", trigger: ".s_website_form_field.s_website_form_custom:not(.s_website_form_required)" + - ":has(.radio label:contains('After-sales Service'):has(input[type='radio']:not([required])))" + - ":has(.radio label:contains('Invoicing Service'):has(input[type='radio']:not([required])))" + - ":has(.radio label:contains('Development Service'):has(input[type='radio']:not([required])))" + - ":has(.radio label:contains('Management Service'):has(input[type='radio']:not([required])))", + ":has(.radio:has(label:contains('After-sales Service')):has(input[type='radio']:not([required])))" + + ":has(.radio:has(label:contains('Invoicing Service')):has(input[type='radio']:not([required])))" + + ":has(.radio:has(label:contains('Development Service')):has(input[type='radio']:not([required])))" + + ":has(.radio:has(label:contains('Management Service')):has(input[type='radio']:not([required])))", run: function () {}, }, diff --git a/addons/website_form/views/snippets/s_website_form.xml b/addons/website_form/views/snippets/s_website_form.xml index 9a4a28fe6db..5f0544f8e1a 100644 --- a/addons/website_form/views/snippets/s_website_form.xml +++ b/addons/website_form/views/snippets/s_website_form.xml @@ -1,7 +1,7 @@ <?xml version="1.0" encoding="utf-8"?> <odoo> -<template id="s_website_form" name="Form"> +<template id="s_website_form" name="Form Builder"> <section class="s_website_form" data-vcss="001"> <div class="container"> <form action="/website_form/" method="post" enctype="multipart/form-data" class="o_mark_required" data-mark="*"> @@ -40,7 +40,7 @@ <we-button data-on-success="redirect" data-name="show_redirect_opt">Redirect</we-button> <we-button data-on-success="message" data-name="show_message_opt">Show Message</we-button> </we-select> - <we-button class="fa fa-fw fa-edit align-self-end toggle-edit-message" title="Edit Message" data-name="message_opt" data-dependencies="show_message_opt"/> + <we-button class="fa fa-fw fa-eye align-self-end toggle-edit-message" title="Edit Message" data-name="message_opt" data-dependencies="show_message_opt"/> </we-row> <we-urlpicker string="URL" data-select-data-attribute="/contactus-thank-you" data-attribute-name="successPage" data-name="url_opt" data-dependencies="show_redirect_opt"/> </div> diff --git a/addons/website_form/views/website_form_templates.xml b/addons/website_form/views/website_form_templates.xml index 256a9ad81f7..d991956ea29 100644 --- a/addons/website_form/views/website_form_templates.xml +++ b/addons/website_form/views/website_form_templates.xml @@ -4,12 +4,12 @@ <template id="contactus_form" name="Contact Form" inherit_id="website.contactus" customize_show="True"> <xpath expr="//div[@name='mail_button']" position="replace"> <span class="hidden" data-for="contactus_form" t-att-data-values="{'email_to': res_company.email}" /> - <div> - <section id="contactus_section" class="s_website_form" data-vcss="001"> + <div id="contactus_section"> + <section class="s_website_form" data-vcss="001"> <div class="container"> <form id="contactus_form" action="/website_form/" method="post" enctype="multipart/form-data" class="o_mark_required" data-mark="*" data-model_name="mail.mail" data-success-mode="redirect" data-success-page="/contactus-thank-you"> <div class="s_website_form_rows row s_col_no_bgcolor"> - <div class="form-group col-12 s_website_form_field s_website_form_custom s_website_form_required" data-type="char"> + <div class="form-group col-12 s_website_form_field s_website_form_custom s_website_form_required" data-type="char" data-name="Field"> <div class="row s_col_no_resize s_col_no_bgcolor"> <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="contact1">Your Name<span class="s_website_form_mark"> *</span></label> <div class="col-sm"> @@ -17,7 +17,7 @@ </div> </div> </div> - <div class="form-group col-12 s_website_form_field s_website_form_custom" data-type="char"> + <div class="form-group col-12 s_website_form_field s_website_form_custom" data-type="char" data-name="Field"> <div class="row s_col_no_resize s_col_no_bgcolor"> <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="contact2">Phone Number</label> <div class="col-sm"> @@ -25,7 +25,7 @@ </div> </div> </div> - <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="email"> + <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="email" data-name="Field"> <div class="row s_col_no_resize s_col_no_bgcolor"> <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="contact3">Email<span class="s_website_form_mark"> *</span></label> <div class="col-sm"> @@ -33,7 +33,7 @@ </div> </div> </div> - <div class="form-group col-12 s_website_form_field s_website_form_custom" data-type="char"> + <div class="form-group col-12 s_website_form_field s_website_form_custom" data-type="char" data-name="Field"> <div class="row s_col_no_resize s_col_no_bgcolor"> <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="contact4">Your Company</label> <div class="col-sm"> @@ -41,7 +41,7 @@ </div> </div> </div> - <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="char"> + <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="char" data-name="Field"> <div class="row s_col_no_resize s_col_no_bgcolor"> <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="contact5">Subject<span class="s_website_form_mark"> *</span></label> <div class="col-sm"> @@ -49,7 +49,7 @@ </div> </div> </div> - <div class="form-group col-12 s_website_form_field s_website_form_custom s_website_form_required" data-type="text"> + <div class="form-group col-12 s_website_form_field s_website_form_custom s_website_form_required" data-type="text" data-name="Field"> <div class="row s_col_no_resize s_col_no_bgcolor"> <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="contact6">Your Question</label> <div class="col-sm"> diff --git a/addons/website_hr_recruitment/views/website_hr_recruitment_templates.xml b/addons/website_hr_recruitment/views/website_hr_recruitment_templates.xml index beba5e518e5..257d415cadc 100644 --- a/addons/website_hr_recruitment/views/website_hr_recruitment_templates.xml +++ b/addons/website_hr_recruitment/views/website_hr_recruitment_templates.xml @@ -135,79 +135,81 @@ <span t-field="job.name"/> </h2> <span class="hidden" data-for="hr_recruitment_form" t-att-data-values="{'department_id': job and job.department_id.id or '', 'job_id': job and job.id or ''}" /> - <section id="forms" class="s_website_form" data-vcss="001"> - <div class="container"> - <form id="hr_recruitment_form" action="/website_form/" method="post" enctype="multipart/form-data" class="o_mark_required" data-mark="*" data-model_name="hr.applicant" data-success-mode="redirect" data-success-page="/job-thank-you" hide-change-model="true"> - <div class="s_website_form_rows row s_col_no_bgcolor"> - <div class="form-group col-12 s_website_form_field s_website_form_required s_website_form_model_required" data-type="char"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment1">Your Name<span class="s_website_form_mark"> *</span></label> - <div class="col-sm"> - <input id="recruitment1" type="text" class="form-control s_website_form_input" name="partner_name" required=""/> + <div id="jobs_section"> + <section id="forms" class="s_website_form" data-vcss="001"> + <div class="container"> + <form id="hr_recruitment_form" action="/website_form/" method="post" enctype="multipart/form-data" class="o_mark_required" data-mark="*" data-model_name="hr.applicant" data-success-mode="redirect" data-success-page="/job-thank-you" hide-change-model="true"> + <div class="s_website_form_rows row s_col_no_bgcolor"> + <div class="form-group col-12 s_website_form_field s_website_form_required s_website_form_model_required" data-type="char" data-name="Field"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment1">Your Name<span class="s_website_form_mark"> *</span></label> + <div class="col-sm"> + <input id="recruitment1" type="text" class="form-control s_website_form_input" name="partner_name" required=""/> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="email"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment2">Your Email<span class="s_website_form_mark"> *</span></label> - <div class="col-sm"> - <input id="recruitment2" type="email" class="form-control s_website_form_input" name="email_from" required=""/> + <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="email" data-name="Field"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment2">Your Email<span class="s_website_form_mark"> *</span></label> + <div class="col-sm"> + <input id="recruitment2" type="email" class="form-control s_website_form_input" name="email_from" required=""/> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="char"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment3">Your Phone Number<span class="s_website_form_mark"> *</span></label> - <div class="col-sm"> - <input id="recruitment3" type="text" class="form-control s_website_form_input" name="partner_phone" required=""/> + <div class="form-group col-12 s_website_form_field s_website_form_required" data-type="char" data-name="Field"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment3">Your Phone Number<span class="s_website_form_mark"> *</span></label> + <div class="col-sm"> + <input id="recruitment3" type="text" class="form-control s_website_form_input" name="partner_phone" required=""/> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_field" data-type="text"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment4">Short Introduction</label> - <div class="col-sm"> - <textarea id="recruitment4" class="form-control s_website_form_input" name="description"></textarea> + <div class="form-group col-12 s_website_form_field" data-type="text" data-name="Field"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment4">Short Introduction</label> + <div class="col-sm"> + <textarea id="recruitment4" class="form-control s_website_form_input" name="description"></textarea> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_field s_website_form_custom" data-type="binary"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment5">Resume</label> - <div class="col-sm"> - <input id="recruitment5" type="file" class="form-control s_website_form_input" name="Resume"/> + <div class="form-group col-12 s_website_form_field s_website_form_custom" data-type="binary" data-name="Field"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment5">Resume</label> + <div class="col-sm"> + <input id="recruitment5" type="file" class="form-control s_website_form_input" name="Resume"/> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_field d-none"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment6">Job</label> - <div class="col-sm"> - <input id="recruitment6" type="hidden" class="form-control s_website_form_input" name="job_id"/> + <div class="form-group col-12 s_website_form_field d-none"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment6">Job</label> + <div class="col-sm"> + <input id="recruitment6" type="hidden" class="form-control s_website_form_input" name="job_id"/> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_field d-none"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment7">Department</label> - <div class="col-sm"> - <input id="recruitment7" type="hidden" class="form-control s_website_form_input" name="department_id"/> + <div class="form-group col-12 s_website_form_field d-none"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="recruitment7">Department</label> + <div class="col-sm"> + <input id="recruitment7" type="hidden" class="form-control s_website_form_input" name="department_id"/> + </div> </div> </div> - </div> - <div class="form-group col-12 s_website_form_submit"> - <div class="row s_col_no_resize s_col_no_bgcolor"> - <div style="width: 200px" class="col-sm-auto s_website_form_label"/> - <div class="col-sm"> - <a href="#" role="button" class="btn btn-primary btn-lg s_website_form_send">Submit</a> - <span id="s_website_form_result"></span> + <div class="form-group col-12 s_website_form_submit"> + <div class="row s_col_no_resize s_col_no_bgcolor"> + <div style="width: 200px" class="col-sm-auto s_website_form_label"/> + <div class="col-sm"> + <a href="#" role="button" class="btn btn-primary btn-lg s_website_form_send">Submit</a> + <span id="s_website_form_result"></span> + </div> </div> </div> </div> - </div> - </form> - </div> - </section> + </form> + </div> + </section> + </div> <div class="oe_structure mt-2"/> </div> </t> diff --git a/addons/website_sale/views/templates.xml b/addons/website_sale/views/templates.xml index f13469443d3..c39a0777f1e 100644 --- a/addons/website_sale/views/templates.xml +++ b/addons/website_sale/views/templates.xml @@ -750,7 +750,7 @@ <div class="container"> <form action="/website_form/" method="post" enctype="multipart/form-data" class="o_mark_required" data-mark="*" data-force_action="shop.sale.order" data-model_name="sale.order" data-success-mode="redirect" data-success-page="/shop/payment" hide-change-model="true"> <div class="s_website_form_rows row s_col_no_bgcolor"> - <div class="form-group col-12 s_website_form_field" data-type="char"> + <div class="form-group col-12 s_website_form_field" data-type="char" data-name="Field"> <div class="row s_col_no_resize s_col_no_bgcolor"> <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="sale1">Your Reference</label> <div class="col-sm"> @@ -758,7 +758,7 @@ </div> </div> </div> - <div class="form-group col-12 s_website_form_field s_website_form_custom" data-type="text"> + <div class="form-group col-12 s_website_form_field s_website_form_custom" data-type="text" data-name="Field"> <div class="row s_col_no_resize s_col_no_bgcolor"> <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="sale2">Give us your feedback</label> <div class="col-sm"> @@ -766,7 +766,7 @@ </div> </div> </div> - <div class="form-group col-12 s_website_form_field s_website_form_custom" data-type="binary"> + <div class="form-group col-12 s_website_form_field s_website_form_custom" data-type="binary" data-name="Field"> <div class="row s_col_no_resize s_col_no_bgcolor"> <label class="col-form-label col-sm-auto s_website_form_label" style="width: 200px" for="sale3">A document to provide</label> <div class="col-sm"> |