Merge PR #252 into 13.0

Signed-off-by pedrobaeza

rma_sale/static/src/js/rma_portal_form.js

@@ -4,42 +4,121 @@
 odoo.define("rma_sale.animation", function(require) {
     "use strict";
 
-    var sAnimation = require("website.content.snippets.animation");
+    const publicWidget = require("web.public.widget");
 
-    // In the customer portal when a RMA operation is selected show the comments
+    /**
-    // selector so the user doesn't miss the chance to add his comments
+     * Adds some machinery to the customer portal RMA form:
-    sAnimation.registry.rma_operation_portal = sAnimation.Class.extend({
+     *
-        selector: ".rma-operation",
+     * - Avoid submitting the form if no qty or operation is reported.
+     * - Show automatically the observations field when the operation is selected
+     *   and hide it back with no operation selected.
+     */
+    publicWidget.registry.PortalRmaSale = publicWidget.Widget.extend({
+        selector: "#form-request-rma",
+        events: {
+            "change .rma-operation": "_onChangeOperationId",
+            "change #delivery-rma-qty input": "_onChangeQty",
+        },
+
+        /**
+         * @override
+         */
         start: function() {
-            this.id = this.el.name.replace("-operation_id", "");
+            const ids = this.$("[name*='-operation_id']")
-            this.$comment = $("#comment-" + this.id);
+                .map(function() {
-            this.$comment_input = $("[name='" + this.id + "-description']");
+                    return this.name.replace("-operation_id", "");
-            var _this = this;
+                })
-            this.$el.on("change", function() {
+                .get();
-                _this._onChangeOperationId();
+            this.$submit = $("#form-request-rma button[type='submit']");
+            this.rows_ids = ids;
+            // We'll build an object that will ease the form check. It could be further
+            // extended with additional checks.
+            this.rows = {};
+            _.each(ids, id => {
+                this.rows[id] = {
+                    $comment: this.$(`#comment-${id}`),
+                    $comment_input: this.$(`[name='${id}-description']`),
+                    $operation: this.$(`[name='${id}-operation_id']`),
+                    $qty: this.$(`[name='${id}-quantity']`),
+                };
             });
+            this._checkCanSubmit();
         },
-        _show_comment: function() {
+        /**
-            if (this.$comment) {
+         * @private
-                this.$comment.removeClass("show");
+         * @param {Object} row: the form row structure
-                this.$comment.addClass("show");
+         */
-                if (this.$comment_input) {
+        _show_comment: function(row) {
-                    this.$comment_input.focus();
+            if (row.$comment) {
+                row.$comment.addClass("show");
+                if (row.$comment_input) {
+                    row.$comment_input.focus();
                 }
             }
         },
-        _hide_comment: function() {
+        /**
-            if (this.$comment) {
+         * @private
-                this.$comment.removeClass("show");
+         * @param {Object} row: the form row structure
+         */
+        _hide_comment: function(row) {
+            if (row.$comment) {
+                row.$comment.removeClass("show");
             }
         },
-        _onChangeOperationId: function() {
+        /**
+         * We should be able to submit only when an operation is selected and a
+         * quantity entered in a row at least.
+         * @private
+         */
+        _canSubmit: function() {
+            var can_submit = false;
+            for (const id of this.rows_ids) {
+                const row = this.rows[id];
+                if (
+                    row &&
+                    // Qty greater than 0
+                    row.$qty &&
+                    row.$qty.val() &&
+                    Number(row.$qty.val()) &&
+                    // An operation is defined
+                    row.$operation &&
+                    row.$operation.val()
+                ) {
+                    can_submit = true;
+                    break;
+                }
+            }
+            return can_submit;
+        },
+        /**
+         * Checked every time we change the quantity or the operation and at start
+         *
+         * @private
+         * @param {Object} row: the form row structure
+         */
+        _checkCanSubmit: function() {
+            this.$submit.prop("disabled", !this._canSubmit());
+        },
+        /**
+         * @private
+         * @param {InputEvent} ev
+         */
+        _onChangeOperationId: function(ev) {
             // Toggle comment on or off if an operation is requested
-            if (this.$el && this.$el.val()) {
+            const id = ev.currentTarget.name.replace("-operation_id", "");
-                this._show_comment();
+            var row = this.rows[id];
+            if (row && row.$operation && row.$operation.val()) {
+                this._show_comment(row);
             } else {
-                this._hide_comment();
+                this._hide_comment(row);
             }
+            this._checkCanSubmit();
+        },
+        /**
+         * @private
+         */
+        _onChangeQty: function() {
+            this._checkCanSubmit();
         },
     });
 });