[17.0][FWP] fs_base_multi_image: drag and drop fixes

fs_base_multi_image/models/fs_image_relation_mixin.py

@@ -82,12 +82,14 @@
 
  @api.model
  def _cleanup_vals(self, vals):
- if (
- "link_existing" in vals
- and vals["link_existing"]
- and "specific_image" in vals
- ):
- vals["specific_image"] = False
+ link_existing = vals.get("link_existing")
+ if link_existing:
+ if "specific_image" in vals:
+ vals.pop("specific_image")
+ if "image" in vals:
+ # image is set when using the kanban renderer so it
+ # prevents the name field to be computed well
+ vals.pop("image")
  return vals
 
  @api.model_create_multi

fs_base_multi_image/static/src/fields/fs_image_relation_dnd_upload/fs_image_relation_dnd_upload.esm.js

@@ -4,10 +4,20 @@ import {X2ManyField, x2ManyField} from "@web/views/fields/x2many/x2many_field";
 import {onWillRender, useRef, useState} from "@odoo/owl";
 import {registry} from "@web/core/registry";
 
+import {useX2ManyCrud} from "@web/views/fields/relational_utils";
+
 export class FsImageRelationDndUploadField extends X2ManyField {
+ /**
+ * When using this widget, displayed image relation views must contains
+ * following fields:
+ * - sequence
+ * - image_id
+ * - specific_image
+ * - link_existing
+ */
  setup() {
  super.setup();
- this.relationField = this.field.relation_field;
+ this.options = this.activeField.options;
  this.defaultTarget = this.props.crudOptions.target || "specific";
  this.state = useState({
  dragging: false,
@@ -16,6 +26,8 @@ export class FsImageRelationDndUploadField extends X2ManyField {
  this.fileInput = useRef("fileInput");
  this.defaultSequence = 0;
 
+ this.operations = useX2ManyCrud(() => this.list, this.isMany2Many);
+
  onWillRender(() => {
  this.initDefaultSequence();
  });
@@ -25,6 +37,10 @@ export class FsImageRelationDndUploadField extends X2ManyField {
  return this.state.target;
  }
 
+ get relationRecordId() {
+ return this.props.record.data.id;
+ }
+
  get displayDndZone() {
  const activeActions = this.activeActions;
  return (
@@ -89,18 +105,15 @@ export class FsImageRelationDndUploadField extends X2ManyField {
 
  async uploadFsImage(imagesDesc) {
  const self = this;
- const createValues = [];
  self.env.model.orm
  .call("fs.image", "create", [imagesDesc])
  .then((fsImageIds) => {
  let values = {};
  $.each(fsImageIds, (i, fsImageId) => {
  values = self.getFsImageRelationValues(fsImageId);
- createValues.push(values);
+ self.createFieldRelationRecords(values);
  });
- })
- .then(() => {
- self.createFieldRelationRecords(createValues);
+ self.env.services.ui.unblock();
  })
  .catch(() => {
  self.displayUploadError();
@@ -120,49 +133,43 @@ export class FsImageRelationDndUploadField extends X2ManyField {
 
  getFsImageRelationValues(fsImageId) {
  let values = {
- image_id: fsImageId,
- link_existing: true,
+ default_image_id: fsImageId,
+ default_link_existing: true,
  };
  values = {...values, ...this.getRelationCommonValues()};
  return values;
  }
 
  async uploadSpecificImage(imagesDesc) {
  const self = this;
- const createValues = [];
  $.each(imagesDesc, (i, imageDesc) => {
- createValues.push(self.getSpecificImageRelationValues(imageDesc));
+ self.createFieldRelationRecords(
+ self.getSpecificImageRelationValues(imageDesc)
+ );
  });
- self.createFieldRelationRecords(createValues);
+ self.env.services.ui.unblock();
  }
 
  getSpecificImageRelationValues(imageDesc) {
- return {...imageDesc, ...this.getRelationCommonValues()};
+ return {
+ ...this.getRelationCommonValues(),
+ default_specific_image: imageDesc.image,
+ };
  }
 
  getRelationCommonValues() {
- const values = {
- sequence: this.getNewSequence(),
+ return {
+ default_sequence: this.getNewSequence(),
  };
- values[this.relationField] = this.props.record.data.id;
- return values;
  }
 
  async createFieldRelationRecords(createValues) {
- const self = this;
- const model = self.env.model;
- model.orm
- .call(self.field.relation, "create", [createValues])
- .then(() => {
- model.root.load();
- model.root.save();
- })
- .then(() => {
- self.env.services.ui.unblock();
- })
- .catch(() => {
- self.displayUploadError();
- });
+ await this.list.addNewRecord({
+ position: "bottom",
+ context: createValues,
+ mode: "readonly",
+ allowWarning: true,
+ });
  }
 
  async uploadImages(files) {

fs_base_multi_image/views/fs_image_relation_mixin.xml

@@ -42,8 +42,10 @@
  <field name="arch" type="xml">
  <kanban>
  <field name="image" />
- <field name="name" />
  <field name="sequence" />
+ <field name="image_id" />
+ <field name="specific_image" />
+ <field name="link_existing" />
  <templates>
  <t t-name="kanban-box">
  <div class="oe_kanban_card oe_kanban_global_click">

fs_product_multi_image/views/fs_product_image.xml

@@ -38,7 +38,7 @@
  />
  <field name="mode">primary</field>
  <field name="arch" type="xml">
- <xpath expr="//kanban/field[@name='name']">
+ <xpath expr="//kanban/field[@name='image']">
  <field name="tag_id" />
  </xpath>
  <xpath expr="//div[hasclass('o_kanban_image')]" position="inside">

fs_product_multi_image/views/product_template.xml

@@ -20,26 +20,20 @@
  </field>
  <page name="sales" position="after">
  <page name="images" string="Images">
- <group>
- <group colspan="12">
- <field
- name="image_ids"
- widget="fs_image_relation_dnd_upload"
- nolabel="1"
- colspan="2"
- >
- <tree>
- <field name="sequence" widget="handle" />
- <field name="name" />
- </tree>
- </field>
- </group>
- <!-- field
- name="image_ids"
- mode="kanban"
- widget="storage_image_handle"
- / -->
- </group>
+ <field
+ name="image_ids"
+ widget="fs_image_relation_dnd_upload"
+ mode="kanban"
+ >
+ <tree>
+ <field name="sequence" widget="handle" />
+ <field name="name" />
+ <field name="link_existing" invisible="1" />
+ <field name="image_id" invisible="1" />
+ <field name="image" invisible="1" />
+ <field name="specific_image" invisible="1" />
+ </tree>
+ </field>
  </page>
  </page>
  </field>