[MIG] website_field_autocomplete: Migration to 17.0

Author: arantxa-s73

website_field_autocomplete/__manifest__.py

@@ -4,7 +4,7 @@
 {
     "name": "Website Field - AutoComplete",
     "summary": "Provides an autocomplete field for Website on any model",
-    "version": "14.0.1.0.0",
+    "version": "17.0.1.0.0",
     "category": "Website",
     "website": "https://github.com/OCA/website",
     "author": "LasLabs, Odoo Community Association (OCA)",
@@ -14,9 +14,13 @@
     "depends": [
         "website",
     ],
-    "data": [
-        "views/assets.xml",
-    ],
+    "assets": {
+        "web.assets_frontend": [
+            "website_field_autocomplete/static/src/lib/jquery.ui/jquery-ui.css",
+            "website_field_autocomplete/static/src/lib/jquery.ui/jquery-ui.js",
+            "website_field_autocomplete/static/src/js/field_autocomplete.esm.js",
+        ],
+    },
     "demo": [
         "demo/field_autocomplete_demo.xml",
     ],

website_field_autocomplete/controllers/main.py

@@ -21,10 +21,10 @@ def _get_field_autocomplete(self, model, **kwargs):
         domain = kwargs.get("domain", [])
         fields = kwargs.get("fields", [])
         limit = kwargs.get("limit", None)
-        res = self._get_autocomplete_data(model, domain, fields, limit)
+        res = self._fetch_autocomplete_data(model, domain, fields, limit)
         return list(res.values())
 
-    def _get_autocomplete_data(self, model, domain, fields, limit=None):
+    def _fetch_autocomplete_data(self, model, domain, fields, limit=None):
         """Gets and returns raw record data
         Params:
             model: Model name to query on

website_field_autocomplete/static/src/js/field_autocomplete.esm.js

@@ -0,0 +1,85 @@
+/** @odoo-module **/
+import publicWidget from "@web/legacy/js/public/public_widget";
+/* Copyright 2016 LasLabs Inc.
+ * License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl.html).
+ */
+
+publicWidget.registry.field_autocomplete = publicWidget.Widget.extend({
+    selector: ".js_website_autocomplete",
+
+    /* Query remote server for autocomplete suggestions
+     * @param request object Request from jQueryUI Autocomplete
+     * @param response function Callback for response, accepts array of str
+     */
+    autocomplete: function (request, response) {
+        let domain = [[this.queryField, "ilike", request.term]];
+        if (this.add_domain) {
+            domain = domain.concat(this.add_domain);
+        }
+        return $.ajax({
+            dataType: "json",
+            url: "/website/field_autocomplete/" + this.model,
+            contentType: "application/json; charset=utf-8",
+            type: "POST",
+            data: JSON.stringify({
+                jsonrpc: "2.0",
+                method: "call",
+                params: {domain: domain, fields: this.fields, limit: this.limit},
+            }),
+        }).then((records) => {
+            const data = records.result.reduce((a, b) => {
+                a.push({label: b[this.displayField], value: b[this.valueField]});
+                return a;
+            }, []);
+            response(data);
+            return records;
+        });
+    },
+
+    /* Return arguments that are used to initialize autocomplete */
+    autocompleteArgs: function () {
+        const self = this;
+        return {
+            source: (request, response) => {
+                this.autocomplete(request, response);
+            },
+            focus: function (event, ui) {
+                self.$target.val(ui.item.label);
+                self.many2oneCompatibility(ui.item);
+                return false;
+            },
+            select: function (event, ui) {
+                self.$target.val(ui.item.label);
+                self.many2oneCompatibility(ui.item);
+                return false;
+            },
+        };
+    },
+
+    start: function () {
+        this.model = this.$target.data("model");
+        this.queryField = this.$target.data("query-field") || "name";
+        this.displayField = this.$target.data("display-field") || this.queryField;
+        this.field = this.$target.data("field") || this.field;
+        this.valueField = this.$target.data("value-field") || this.displayField;
+        this.limit = this.$target.data("limit") || 10;
+        this.add_domain = this.$target.data("domain");
+        this.fields = [this.displayField];
+        if (this.valueField !== this.displayField) {
+            this.fields.push(this.valueField);
+        }
+        this.$target.autocomplete(this.autocompleteArgs());
+        return this._super(...arguments);
+    },
+
+    many2oneCompatibility: function (item) {
+        if (!this.field) return;
+        let formField = $(this.el.closest("form")).find(`input[name='${this.field}']`);
+        if (!formField.length) {
+            formField = $(this.el.closest("form")).append(
+                `<input class="d-none" name='${this.field}' />`
+            );
+        }
+        formField.val(item.value);
+    },
+});