From 0191b9e9abfaa71d32fdff2c7c5ee3b5a0b4d1a5 Mon Sep 17 00:00:00 2001
From: Soufiane <soufiane@scinote.net>
Date: Fri, 15 Sep 2023 14:52:36 +0200
Subject: [PATCH] Fix wellplates reversed columns and rows headers [SCI-9071]
 (#6196)

- Fix well plates reversed columns and rows headers.
- Fix jumping when in edit mode.
- Fix disappearing columns after edit.
---
 app/javascript/vue/shared/content/table.vue | 26 ++++++++++-----------
 1 file changed, 12 insertions(+), 14 deletions(-)

diff --git a/app/javascript/vue/shared/content/table.vue b/app/javascript/vue/shared/content/table.vue
index 25bb5e633..8f4e98312 100644
--- a/app/javascript/vue/shared/content/table.vue
+++ b/app/javascript/vue/shared/content/table.vue
@@ -170,7 +170,11 @@
       },
       updateName(name) {
         this.element.attributes.orderable.name = name;
-        this.update();
+        // Prevents the table from being updated when the name is updated
+        this.updatingTableData = true;
+        this.update(() => {
+          this.updatingTableData = false;
+        });
       },
       openNameModal() {
         this.tableObject.deselectCell();
@@ -191,10 +195,12 @@
       updateTable() {
         if (this.editingTable == false) return;
 
-        this.update();
-        this.editingTable = false;
+        this.update(() => {
+          this.editingTable = false;
+          this.updatingTableData = false;
+        });
       },
-      update() {
+      update(callback = () => {}) {
         this.element.attributes.orderable.contents = JSON.stringify({ data: this.tableObject.getData() });
         let metadata = this.element.attributes.orderable.metadata || {};
         if (metadata.plateTemplate) {
@@ -232,16 +238,8 @@
                           })
             });
         }
-        this.$emit('update', this.element)
-        this.ajax_update_url()
-        this.updatingTableData = false;
-      },
-      ajax_update_url() {
-        $.ajax({
-          url: this.element.attributes.orderable.urls.update_url,
-          method: 'PUT',
-          data: this.element.attributes.orderable,
-        })
+
+        this.$emit('update', this.element, false, callback)
       },
       loadTableData() {
         let container = this.$refs.hotTable;