@oniti/quasar-ui-vlank-collection-crud 3.7.45 → 3.7.46

package/dist/index.umd.js

@@ -1,6 +1,6 @@
 /*!
- * @oniti/quasar-ui-vlank-collection-crud v3.5.11
- * (c) 2022 Oniti
+ * @oniti/quasar-ui-vlank-collection-crud v3.7.45
+ * (c) 2024 Oniti
  * Released under the MIT License.
  */
 
@@ -77,7 +77,8 @@
     }, props.props.modalDeleteOptions.dialog, {
       "transition-show": __props.isMobile ? 'slide-up' : 'fade',
       "transition-hide": __props.isMobile ? 'slide-down' : 'fade',
-      position: __props.isMobile ? 'bottom' : 'standard',
+      "transition-duration": "150",
+      position: "standard",
       "full-width": __props.isMobile
     }), {
       default: vue.withCtx(function () { return [
@@ -153,7 +154,7 @@
         }, 16 /* FULL_PROPS */)
       ]; }),
       _: 3 /* FORWARDED */
-    }, 16 /* FULL_PROPS */, ["modelValue", "transition-show", "transition-hide", "position", "full-width"]))
+    }, 16 /* FULL_PROPS */, ["modelValue", "transition-show", "transition-hide", "full-width"]))
   }
   }
 
@@ -165,7 +166,6 @@
   var _hoisted_2$3 = /*#__PURE__*/vue.createTextVNode("Modification");
 
 
-
   var script$4 = {
     __name: 'VlankEditModal',
     props: {
@@ -174,14 +174,15 @@
     modalEditOptions: Object,
     collection: String,
     extraRequestParams: Object,
+    useSendFiles: Boolean,
     storeKey: String,
     isMobile: Boolean,
     closeModalAfterValidation: Boolean,
     propsLibelleTitle: String,
   },
     emits: ['close'],
-    setup: function setup(__props, ref) {
-  var $emit = ref.emit;
+    setup: function setup(__props, ref$1) {
+  var $emit = ref$1.emit;
 
 
   var props = __props;
@@ -212,28 +213,70 @@
 
   function onConfirmeEditAdd() {
     var action = props.localDetail.uuid ? "update" : "create";
+    var message_notification = props.localDetail.uuid
+      ? "Modification effectuée"
+      : "Création effectuée";
     var extraParams =
       action === "update"
         ? Object.assign({}, props.extraRequestParams.update)
         : Object.assign({}, props.extraRequestParams.store);
-    $collectionCrud
-      .collectionAction({
-        collectionName: props.collection,
-        action: action,
-        params: Object.assign({}, props.localDetail, extraParams),
-        list_field: props.storeKey
-      })
-      .then(function (obj) {
-        if (props.closeModalAfterValidation) {
-          close(obj, action);
-        }
-      });
+
+    if (props.useSendFiles) {
+      $collectionCrud
+        .collectionAction({
+          collectionName: props.collection,
+          action: "send-file",
+          params: Object.assign({}, props.localDetail, extraParams),
+          list_field: props.storeKey,
+          axios_options: {
+            oniti_success_notification_message: message_notification,
+          },
+        })
+        .then(function (obj) {
+          if (props.closeModalAfterValidation) {
+            close(obj, action);
+          }
+        });
+    } else {
+      $collectionCrud
+        .collectionAction({
+          collectionName: props.collection,
+          action: action,
+          params: Object.assign({}, props.localDetail, extraParams),
+          list_field: props.storeKey
+        })
+        .then(function (obj) {
+          if (props.closeModalAfterValidation) {
+            close(obj, action);
+          }
+        });
+      }
   }
 
   function close(obj, action) {
     $emit("close", { obj: obj, action: action });
   }
 
+  var modalContent = vue.ref(null);
+  var modalContentDetail = vue.ref(null);
+
+  var observer = new ResizeObserver(function (entries) {
+    entries.forEach(function (entry) {
+      scrollAreaStyle.value.height = props.isMobile ? '100vh' : entry.contentRect.height < 800 ? entry.contentRect.height + 'px' : '80vh';
+    });
+  });
+
+  var scrollAreaStyle = vue.ref({
+    height: props.isMobile ? '100vh' : modalContent.value ? modalContent.value.clientHeight < 800 ? modalContent.value.clientHeight + 'px' : '80vh' : '80vh'
+  });
+
+  vue.watch(modalContent, function (value) {
+    scrollAreaStyle.value.height = props.isMobile ? '100vh' : value ? value.clientHeight < 800 ? value.clientHeight + 'px' : '80vh' : '80vh';
+    if(modalContent.value){
+      observer.observe(modalContent.value);
+    }
+  }, { immediate: true, deep: true });
+
   return function (_ctx, _cache) {
     var _directive_close_popup = vue.resolveDirective("close-popup");
 
@@ -333,13 +376,24 @@
               ]; }),
               _: 3 /* FORWARDED */
             }, 16 /* FULL_PROPS */, ["class"]),
-            vue.createElementVNode("div", {
-              class: vue.normalizeClass({'mobile-content': __props.isMobile })
-            }, [
-              vue.renderSlot(_ctx.$slots, "create-edit-modal-content", {
-                data: props.localDetail
-              })
-            ], 2 /* CLASS */),
+            vue.createVNode(vue.unref(quasar.QScrollArea), {
+              style: vue.normalizeStyle(scrollAreaStyle.value)
+            }, {
+              default: vue.withCtx(function () { return [
+                vue.createElementVNode("div", {
+                  class: vue.normalizeClass({'mobile-content': __props.isMobile }),
+                  ref_key: "modalContent",
+                  ref: modalContent
+                }, [
+                  vue.renderSlot(_ctx.$slots, "create-edit-modal-content", {
+                    data: props.localDetail,
+                    ref_key: "modalContentDetail",
+                    ref: modalContentDetail
+                  })
+                ], 2 /* CLASS */)
+              ]; }),
+              _: 3 /* FORWARDED */
+            }, 8 /* PROPS */, ["style"]),
             (!__props.isMobile)
               ? (vue.openBlock(), vue.createBlock(vue.unref(quasar.QCardActions), {
                   key: 0,
@@ -422,9 +476,11 @@
     props: {
     data: Object,
     colOptions: Object,
-    props: Object
+    props: Object,
+    rowIndex: Number,
+    cellIndex: Number,
   },
-    emits: ['update'],
+    emits: ['update', 'onEditCellHandler', 'onClickTabHandler'],
     setup: function setup(__props, ref$1) {
   var $emit = ref$1.emit;
 
@@ -440,9 +496,7 @@
 
   var getRawValue = vue.computed({
     get: function () {
-      if (props.colOptions.format)
-        { return props.colOptions.format(localDetail.value[props.colOptions.name]); }
-      else { return localDetail.value[props.colOptions.name]; }
+      return localDetail.value[props.colOptions.name];
     },
     set: function (newValue) {
       localDetail.value[props.colOptions.name] = newValue;
@@ -475,13 +529,22 @@
         list_field: props.props.storeKey
       })
       .then(function (obj) {
-        $emit("update", { obj: obj, action: "update" });
+        $emit("update", { obj: obj, action: "update", callback: function () {
+          $emit("onClickTabHandler", props.rowIndex, props.cellIndex);
+        }});
       });
   }
 
-  return function (_ctx, _cache) {
-    var _component_q_input = vue.resolveComponent("q-input");
+  function onEditCellHandler(field, value) {
+    $emit("onEditCellHandler", field, value);
+  }
+
+  function onClickTabHandler(event) {
+    var newValue = event.target.value;
+    $emit("onClickTabHandler", props.rowIndex, props.cellIndex, newValue != localValue.value);
+  }
 
+  return function (_ctx, _cache) {
     return (vue.openBlock(), vue.createElementBlock("td", null, [
       (localDetail.value[props.colOptions.name] && props.colOptions.type === 'boolean')
         ? vue.renderSlot(_ctx.$slots, getScopedSlotName('boolean-check', props.colOptions.name), { key: 0 }, function () { return [
@@ -499,18 +562,21 @@
         modelValue: localValue.value,
         "onUpdate:modelValue": _cache[0] || (_cache[0] = function ($event) { return ((localValue).value = $event); }),
         "auto-save": "",
-        onSave: onSave
+        onSave: onSave,
+        onKeydown: vue.withKeys(vue.withModifiers(onClickTabHandler, ["prevent","stop"]), ["tab"])
       }, {
         default: vue.withCtx(function (scope) { return [
-          vue.createVNode(_component_q_input, {
+          vue.createVNode(vue.unref(quasar.QInput), vue.mergeProps(props.colOptions.inputOptions, {
+            autofocus: "",
+            "emit-value": "",
             modelValue: scope.value,
-            "onUpdate:modelValue": function ($event) { return ((scope.value) = $event); },
+            "onUpdate:modelValue": [function ($event) { return ((scope.value) = $event); }, function ($event) { return (onEditCellHandler(props.colOptions.field, scope.value)); }],
             label: props.colOptions.label,
             onKeyup: vue.withKeys(scope.set, ["enter"])
-          }, null, 8 /* PROPS */, ["modelValue", "onUpdate:modelValue", "label", "onKeyup"])
+          }), null, 16 /* FULL_PROPS */, ["modelValue", "onUpdate:modelValue", "label", "onKeyup"])
         ]; }),
         _: 1 /* STABLE */
-      }, 8 /* PROPS */, ["modelValue"])
+      }, 8 /* PROPS */, ["modelValue", "onKeydown"])
     ]))
   }
   }
@@ -554,6 +620,7 @@
       table: {
         title: "Titre Non défini",
       },
+      useSendFiles: false,
       extraRequestParams: {
         index: {},
         show: {},
@@ -580,10 +647,12 @@
         props.modalEditOptions);
       props.modalEditOptions.showBtn = Object.assign({}, defaultOptions.modalEditOptions.showBtn,
         props.modalEditOptions.showBtn);
+      var extraRequestParamsTemp = {};
       Object.keys(defaultOptions.extraRequestParams).forEach(function (key) {
-        props.extraRequestParams[key] = Object.assign({}, defaultOptions.extraRequestParams[key],
+        extraRequestParamsTemp[key] = Object.assign({}, defaultOptions.extraRequestParams[key],
           props.extraRequestParams[key]);
       });
+      props.extraRequestParams = extraRequestParamsTemp;
       return props;
     });
 
@@ -689,7 +758,9 @@
         align: "left",
         sortable: true,
         type: "string",
+        classes:  props.value.getRowCellClass,
       };
+
       // Option de la table par défaut
       var defautOptionsTable = {
         loading: $collectionCrud.getFromCollection(
@@ -701,7 +772,8 @@
         "row-key": function (row) { return config.columns
             .filter(function (c) { return c.name !== undefined || c.field !== undefined; })
             .map(function (c) { return row[c.name ? c.name : c.field]; })
-            .join(); },
+            .join() +
+          row[$collectionCrud.getRouteParameterName(props.value.collection)]; },
         "rows-per-page-options": [20, 50, 100],
       };
 
@@ -797,7 +869,7 @@
     /**
      * Renvoie le nom de la route pour les liens de type A pour les édition en page
      */
-     var collectionCreateNamedRoute = vue.computed(function () {
+    var collectionCreateNamedRoute = vue.computed(function () {
       return props.value.collection + "-store";
     });
 
@@ -810,6 +882,10 @@
       return typeof options.to === "function";
     }
 
+    function getAdditionalClassActionBtns(row) {
+      return props.value.getRowCellClass ? ' '+props.value.getRowCellClass(row) : "";
+    }
+
     return {
       customFields: customFields,
       table: table,
@@ -818,6 +894,7 @@
       collectionEditNamedRoute: collectionEditNamedRoute,
       collectionCreateNamedRoute: collectionCreateNamedRoute,
       isTdClickable: isTdClickable,
+      getAdditionalClassActionBtns: getAdditionalClassActionBtns,
     };
   }
 
@@ -1088,6 +1165,7 @@
       var rowsPerPage = ref.rowsPerPage;
       var sortBy = ref.sortBy;
       var descending = ref.descending;
+
       var filter = options.filter;
       asyncProps.value = options;
 
@@ -1180,6 +1258,7 @@
             stringlifyAndCheck(newValue.index, extraRequestParamsIndexStringlify)
           ) {
             getList(true);
+            extraRequestParamsIndexStringlify.value = JSON.stringify(newValue.index);
           }
         }
       });
@@ -1206,11 +1285,26 @@
     }
   }
 
+  function useSelection(props)
+  {
+      var selectedData = vue.ref([]);
+      var selectionMode = vue.ref(props.value.table.selection ? props.value.table.selection : 'none');
+
+      vue.watch(selectedData,function(){
+          props.value.table.selected = selectedData.value;
+      });
+
+      return {
+          selectedData: selectedData,
+          selectionMode: selectionMode,
+      }
+  }
+
   var _hoisted_1$2 = { class: "col" };
   var _hoisted_2$2 = { key: 1 };
   var _hoisted_3$2 = { key: 2 };
   var _hoisted_4$2 = ["props", "onClick"];
-  var _hoisted_5$2 = ["props", "onClick"];
+  var _hoisted_5$1 = ["props", "onClick"];
   var _hoisted_6 = { class: "top-right-content" };
   var _hoisted_7 = { id: "search-slot" };
   var _hoisted_8 = { id: "top-right-under-add" };
@@ -1227,6 +1321,10 @@
     showBtnEdit: Boolean,
     showSlideLeft: Boolean,
     showBtnCreate: Boolean,
+    showBtnCreateTooltip:{
+      type: Boolean,
+      default: false
+    },
     storeKey: {
       type: String,
       default: 'list'
@@ -1261,6 +1359,7 @@
       type: Object,
       default: vue.ref({})
     },
+    useSendFiles: Boolean,
     modalDeleteOptions: Object,
     modalEditOptions: Object,
     persistTableOptions: Object,
@@ -1274,12 +1373,18 @@
       type: Boolean,
       default: true
     },
+    getRowCellClass: {
+      type: Function,
+      default: null
+    },
   },
     emits: [
     "detailChange",
     "modalOpenCreateUpdate",
     "actionsCallback",
-    "actionsSlideLeft" ],
+    "actionsSlideLeft",
+    "onEditCellHandler"
+  ],
     setup: function setup(__props, ref$1) {
   var $emit = ref$1.emit;
 
@@ -1302,8 +1407,8 @@
   });
 
   var isMobile = vue.computed(function () {
-    if ($q.config.collectionCrudOptions && $q.screen.lt[$q.config.collectionCrudOptions.maximalMobileScreenSize]) {
-      return $q.screen.lt[$q.config.collectionCrudOptions.maximalMobileScreenSize]
+    if ($q.config.collectionCrudOptions && $q.config.collectionCrudOptions.maximalMobileScreenSize) {
+      return !!$q.screen.lt[$q.config.collectionCrudOptions.maximalMobileScreenSize]
     } else {
       return $q.screen.lt.md
     }
@@ -1340,6 +1445,7 @@
   var collectionEditNamedRoute = ref$4.collectionEditNamedRoute;
   var collectionCreateNamedRoute = ref$4.collectionCreateNamedRoute;
   var isTdClickable = ref$4.isTdClickable;
+  var getAdditionalClassActionBtns = ref$4.getAdditionalClassActionBtns;
 
   var ref$5 = usePagination(props);
   var pagination = ref$5.pagination;
@@ -1371,6 +1477,10 @@
   var onCloseEditModal = ref$7.onCloseEditModal;
   var onCloseDeleteModal = ref$7.onCloseDeleteModal;
 
+  var ref$8 = useSelection(props);
+  var selectedData = ref$8.selectedData;
+  var selectionMode = ref$8.selectionMode;
+
 
   useWatchs($attrs, getList, pagination, ccrudTable);
 
@@ -1392,7 +1502,7 @@
     clearTimeout(timer);
   });
   function onClickRow(row) {
-      onClickEdit(row);
+    onClickEdit(row);
   }
   function onSlideLeft(details, row) {
     $emit("actionsSlideLeft", details, row);
@@ -1422,8 +1532,54 @@
       document.getElementsByClassName(slideItemClass)[index].style.visibility = 'hidden';
     }
   }
-  //
 
+  function onEditCellHandler(field, value) {
+    $emit("onEditCellHandler", field, value);
+  }
+
+  // Gestion de la tabulation dans le tableau
+  var popupCells = vue.ref([]);
+
+  var delayNextTabOption = vue.ref(null);
+  vue.watch(rows, function (newValue, oldValue) {
+    if (delayNextTabOption.value) {
+      setTimeout(function () {
+        if (delayNextTabOption.value) {
+          onClickTabHandler(delayNextTabOption.value.rowIndex, delayNextTabOption.value.cellIndex, false, false);
+        }
+      }, 400);
+    }
+  }, { deep: true });
+
+  function onClickTabHandler(rowIndex, cellIndex, updated, openPrevious) {
+    if ( updated === void 0 ) updated = false;
+    if ( openPrevious === void 0 ) openPrevious = true;
+
+    if (openPrevious) {
+      popupCells.value[rowIndex + '_' + cellIndex].$el.click();
+    }
+    if (updated) {
+      delayNextTabOption.value = {
+        rowIndex: rowIndex,
+        cellIndex: cellIndex
+      };
+    } else {
+      delayNextTabOption.value = null;
+      popupCells.value[getNextCellIndex(rowIndex, cellIndex)].$el.click();
+    }
+  }
+  function getRowIndex(row) {
+    return rows.value.indexOf(row);
+  }function getNextCellIndex(rowIndex, cellIndex) {
+    if (getEditablesTd.value.length > parseInt(cellIndex) + 1) {
+      return rowIndex + '_' + (parseInt(cellIndex) + 1)
+    } else {
+      return (parseInt(rowIndex) + 1) + '_' + 0
+    }
+  }
+  function onClearSearchHandler() {
+    filter.value = "";
+  }
 
   return function (_ctx, _cache) {
     return (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [
@@ -1433,10 +1589,13 @@
       }, vue.unref(table), {
         filter: filter.value,
         onRequest: vue.unref(asyncRequest),
+        ref_key: "ccrudTable",
+        ref: ccrudTable,
         pagination: vue.unref(pagination),
         "onUpdate:pagination": _cache[1] || (_cache[1] = function ($event) { return (vue.isRef(pagination) ? (pagination).value = $event : null); }),
-        ref_key: "ccrudTable",
-        ref: ccrudTable
+        selection: vue.unref(selectionMode),
+        selected: vue.unref(selectedData),
+        "onUpdate:selected": _cache[2] || (_cache[2] = function ($event) { return (vue.isRef(selectedData) ? (selectedData).value = $event : null); })
       }), vue.createSlots({
         "top-left": vue.withCtx(function () { return [
           vue.createElementVNode("div", null, [
@@ -1454,16 +1613,27 @@
                     modelValue: filter.value,
                     "onUpdate:modelValue": _cache[0] || (_cache[0] = function ($event) { return ((filter).value = $event); }),
                     placeholder: "Recherche",
-                    filled: "",
-                    "bg-color": "grey-2",
-                    square: "",
+                    outlined: "",
+                    rounded: vue.unref(isMobile),
                     style: {"width":"180px"}
                   }, {
                     append: vue.withCtx(function () { return [
-                      vue.createVNode(vue.unref(quasar.QIcon), { name: "search" })
+                      (filter.value)
+                        ? (vue.openBlock(), vue.createBlock(vue.unref(quasar.QBtn), {
+                            key: 0,
+                            dense: "",
+                            flat: "",
+                            round: "",
+                            icon: "mdi-close",
+                            onClick: onClearSearchHandler
+                          }))
+                        : (vue.openBlock(), vue.createBlock(vue.unref(quasar.QIcon), {
+                            key: 1,
+                            name: "search"
+                          }))
                     ]; }),
                     _: 1 /* STABLE */
-                  }, 8 /* PROPS */, ["modelValue"]))
+                  }, 8 /* PROPS */, ["modelValue", "rounded"]))
                 : vue.createCommentVNode("v-if", true),
               (vue.unref(showBtnCreatePage))
                 ? (vue.openBlock(), vue.createBlock(vue.unref(quasar.QBtn), {
@@ -1475,7 +1645,12 @@
                     color: "primary",
                     style: {"margin-left":"1em"},
                     square: ""
-                  }, null, 8 /* PROPS */, ["to", "label"]))
+                  }, {
+                    default: vue.withCtx(function () { return [
+                      vue.renderSlot(_ctx.$slots, "create-btn-tooltip")
+                    ]; }),
+                    _: 3 /* FORWARDED */
+                  }, 8 /* PROPS */, ["to", "label"]))
                 : (vue.unref(showBtnCreate))
                   ? (vue.openBlock(), vue.createBlock(vue.unref(quasar.QBtn), {
                       key: 2,
@@ -1485,7 +1660,12 @@
                       style: {"margin-left":"1em"},
                       onClick: vue.unref(onClickAdd),
                       square: ""
-                    }, null, 8 /* PROPS */, ["label", "onClick"]))
+                    }, {
+                      default: vue.withCtx(function () { return [
+                        vue.renderSlot(_ctx.$slots, "create-btn-tooltip")
+                      ]; }),
+                      _: 3 /* FORWARDED */
+                    }, 8 /* PROPS */, ["label", "onClick"]))
                   : vue.createCommentVNode("v-if", true),
               vue.renderSlot(_ctx.$slots, "top-right-after-add")
             ]),
@@ -1500,7 +1680,7 @@
           return [
           vue.createElementVNode("td", {
             props: props,
-            class: "action-buttons"
+            class: vue.normalizeClass('action-buttons' + vue.unref(getAdditionalClassActionBtns)(props.row))
           }, [
             vue.renderSlot(_ctx.$slots, "row-action-before-controllers", {
                   key: 0,
@@ -1520,24 +1700,18 @@
                 ? (vue.openBlock(), vue.createBlock(vue.unref(quasar.QBtn), {
                     key: 2,
                     type: "a",
-                    to: {
-              name: vue.unref(collectionEditNamedRoute),
-              params: ( obj = {}, obj[vue.unref(route_parameter_name)] = props.row[vue.unref(route_parameter_name)], obj ),
-            },
+                    to: { name: vue.unref(collectionEditNamedRoute), params: ( obj = {}, obj[vue.unref(route_parameter_name)] = props.row[vue.unref(route_parameter_name)], obj ) },
                     color: "primary",
                     icon: "edit",
                     flat: "",
                     round: vue.unref(isMobile)
                   }, null, 8 /* PROPS */, ["to", "round"]))
                 : vue.createCommentVNode("v-if", true),
-            (!__props.editablePage && __props.displayActionCallback(props.row, 'show'))
+            (!__props.editablePage && vue.unref(showBtnEditPage) && __props.displayActionCallback(props.row, 'show'))
               ? (vue.openBlock(), vue.createBlock(vue.unref(quasar.QBtn), {
                   key: 3,
                   type: "a",
-                  to: {
-              name: vue.unref(collectionEditNamedRoute),
-              params: ( obj$1 = {}, obj$1[vue.unref(route_parameter_name)] = props.row[vue.unref(route_parameter_name)], obj$1 ),
-            },
+                  to: { name: vue.unref(collectionEditNamedRoute), params: ( obj$1 = {}, obj$1[vue.unref(route_parameter_name)] = props.row[vue.unref(route_parameter_name)], obj$1 ) },
                   color: "primary",
                   icon: "mdi-magnify-plus-outline",
                   flat: ""
@@ -1556,7 +1730,7 @@
             vue.renderSlot(_ctx.$slots, "row-action-after-controllers", {
               data: props.row
             })
-          ], 8 /* PROPS */, _hoisted_9)
+          ], 10 /* CLASS, PROPS */, _hoisted_9)
         ];
     }),
         _: 2 /* DYNAMIC */
@@ -1584,13 +1758,13 @@
                   default: vue.withCtx(function () { return [
                     vue.createVNode(vue.unref(quasar.QItem), {
                       style: {"align-items":"center"},
-                      class: "mobile-item"
+                      class: vue.normalizeClass('mobile-item' + vue.unref(getAdditionalClassActionBtns)(props.row))
                     }, {
                       default: vue.withCtx(function () { return [
                         vue.createCommentVNode(" On affiche la première colonne seulement et on garde celle des actions "),
                         vue.createVNode(vue.unref(quasar.QItemSection), {
                           class: "mobile-item-content",
-                          onClick: function ($event) { return (vue.unref(showBtnEdit) ? onClickRow(props.row):''); }
+                          onClick: function ($event) { return (vue.unref(showBtnEdit) ? onClickRow(props.row) : ''); }
                         }, {
                           default: vue.withCtx(function () { return [
                             (vue.unref($slots)['body-cell-mobile'])
@@ -1606,7 +1780,7 @@
                           _: 2 /* DYNAMIC */
                         }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["onClick"]),
                         vue.createVNode(vue.unref(quasar.QItemSection), {
-                          style: {"display":"flex","flex-direction":"row"},
+                          style: {"display":"flex","flex-direction":"row","align-items":"center"},
                           side: ""
                         }, {
                           default: vue.withCtx(function () { return [
@@ -1620,7 +1794,7 @@
                         }, 1024 /* DYNAMIC_SLOTS */)
                       ]; }),
                       _: 2 /* DYNAMIC */
-                    }, 1024 /* DYNAMIC_SLOTS */)
+                    }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["class"])
                   ]; }),
                   _: 2 /* DYNAMIC */
                 }, [
@@ -1656,7 +1830,7 @@
                 ? (vue.openBlock(), vue.createElementBlock("td", {
                     props: props,
                     key: options.slotName,
-                    class: vue.normalizeClass(vue.unref(isTdClickable)(options) ? 'cursor-pointer' : ''),
+                    class: vue.normalizeClass((vue.unref(isTdClickable)(options) ? 'cursor-pointer' : '') + vue.unref(getAdditionalClassActionBtns)(props.row)),
                     onClick: function ($event) { return (vue.unref(isTdClickable)(options) ? options.to(props.row) : null); }
                   }, [
                     (props.row[options.field])
@@ -1678,11 +1852,11 @@
                 : (vue.openBlock(), vue.createElementBlock("td", {
                     props: props,
                     key: options.slotName + '-else',
-                    class: "cursor-pointer",
+                    class: vue.normalizeClass('cursor-pointer' + vue.unref(getAdditionalClassActionBtns)(props.row)),
                     onClick: function ($event) { return (options.to(props.row)); }
                   }, vue.toDisplayString(options.format
-                  ? options.format(props.row)
-                  : props.row[options.field]), 9 /* TEXT, PROPS */, _hoisted_5$2))
+                ? options.format(props.row)
+                : props.row[options.field]), 11 /* TEXT, CLASS, PROPS */, _hoisted_5$1))
             ]; })
           }
         }),
@@ -1694,17 +1868,22 @@
             ]; })
           }
         }),
-        vue.renderList(vue.unref(getEditablesTd), function (config) {
+        vue.renderList(vue.unref(getEditablesTd), function (config, index) {
           return {
             name: config.slotName,
             fn: vue.withCtx(function (slotProps) { return [
               (vue.unref(editOnTable))
                 ? (vue.openBlock(), vue.createBlock(script$3, {
+                    ref: function (el) { popupCells.value[getRowIndex(slotProps.row) + '_' + index] = el; },
                     key: config.slotName,
+                    rowIndex: getRowIndex(slotProps.row),
+                    cellIndex: index,
                     data: slotProps.row,
                     props: vue.unref(props),
                     colOptions: config.options,
-                    onUpdate: vue.unref(onUpdateTd)
+                    onUpdate: vue.unref(onUpdateTd),
+                    onOnEditCellHandler: onEditCellHandler,
+                    onOnClickTabHandler: onClickTabHandler
                   }, vue.createSlots({ _: 2 /* DYNAMIC */ }, [
                     vue.renderList(vue.unref($slots), function (_, slot) {
                       return {
@@ -1714,12 +1893,12 @@
                         ]; })
                       }
                     })
-                  ]), 1032 /* PROPS, DYNAMIC_SLOTS */, ["data", "props", "colOptions", "onUpdate"]))
+                  ]), 1032 /* PROPS, DYNAMIC_SLOTS */, ["rowIndex", "cellIndex", "data", "props", "colOptions", "onUpdate"]))
                 : vue.createCommentVNode("v-if", true)
             ]; })
           }
         })
-      ]), 1040 /* FULL_PROPS, DYNAMIC_SLOTS */, ["rows", "filter", "onRequest", "pagination"]),
+      ]), 1040 /* FULL_PROPS, DYNAMIC_SLOTS */, ["rows", "filter", "onRequest", "pagination", "selection", "selected"]),
       vue.createCommentVNode(" Modal de Confirmation Suppression "),
       vue.createVNode(script$5, {
         localDetail: localDetail.value,
@@ -1755,7 +1934,7 @@
             name: slot,
             fn: vue.withCtx(function (scope) { return [
               (vue.openBlock(), vue.createElementBlock("div", {
-                class: vue.normalizeClass(vue.unref(isMobile) ? 'mobile-content modal-content':'modal-content'),
+                class: vue.normalizeClass(vue.unref(isMobile) ? 'mobile-content modal-content' : 'modal-content'),
                 key: slot
               }, [
                 vue.renderSlot(_ctx.$slots, slot, vue.normalizeProps(vue.guardReactiveProps(scope)))
@@ -1770,23 +1949,35 @@
 
   };
 
-  var css_248z$2 = "\n.action-buttons[data-v-60881ef8] {\n  text-align: end;\n}\n.modal-content[data-v-60881ef8] {\n  padding: 15px;\n}\n.q-table-control[data-v-60881ef8] {\n  flex: 0 1 55%;\n}\n#search-slot[data-v-60881ef8] {\n  display: flex;\n}\n#top-right-under-add[data-v-60881ef8] {\n  margin-top: 20px;\n  display: flex;\n  flex-direction: column;\n}\n.mobile-item[data-v-60881ef8] {\n  min-height: 8.5vh;\n  border-bottom: solid 1px lightgrey;\n}\n.mobile-item-content>span[data-v-60881ef8] {\n  word-break: break-all;\n}\n.body-cell-mobile[data-v-60881ef8] {\n  word-break: break-all;\n}\n";
+  var css_248z$2 = "\n.action-buttons[data-v-60881ef8] {\n  text-align: end;\n}\n.modal-content[data-v-60881ef8] {\n  padding: 15px;\n}\n.q-table-control[data-v-60881ef8] {\n  flex: 0 1 55%;\n}\n#search-slot[data-v-60881ef8] {\n  display: flex;\n  align-items: center;\n}\n#top-right-under-add[data-v-60881ef8] {\n  margin-top: 20px;\n  display: flex;\n  flex-direction: column;\n}\n.mobile-item[data-v-60881ef8] {\n  min-height: 8.5vh;\n  border-bottom: solid 1px lightgrey;\n}\n.mobile-item-content>span[data-v-60881ef8] {\n  word-break: break-all;\n}\n.body-cell-mobile[data-v-60881ef8] {\n  word-break: break-all;\n}\n";
   styleInject(css_248z$2);
 
   script$2.__scopeId = "data-v-60881ef8";
   script$2.__file = "src/components/VlankCollectionCrud.vue";
 
-  var _hoisted_1$1 = {
-    key: 0,
-    class: "edit-page-header"
-  };
-  var _hoisted_2$1 = { style: {"display":"flex","align-items":"center"} };
-  var _hoisted_3$1 = { key: 0 };
-  var _hoisted_4$1 = {
+  function onClickBack(route, router) {
+    if(!route || !route.meta) {
+      router.go(-1);
+      return;
+    }
+    var localStorageRoute = localStorage.getItem(route.meta.goBackRoute);
+    if (localStorageRoute) {
+      router.push(localStorageRoute);
+      localStorage.removeItem(route.meta.goBackRoute);
+    } else if (route.meta.mainParentRoutePath) {
+      router.push(route.meta.mainParentRoutePath);
+    } else {
+      router.go(-1);
+    }
+  }
+
+  var _hoisted_1$1 = { style: {"display":"flex","align-items":"center"} };
+  var _hoisted_2$1 = { key: 0 };
+  var _hoisted_3$1 = {
     key: 1,
     class: "edit-page-body"
   };
-  var _hoisted_5$1 = {
+  var _hoisted_4$1 = {
     key: 2,
     class: "edit-page-body"
   };
@@ -1800,12 +1991,17 @@
   var $emit = ref$1.emit;
 
 
-  var router = vueRouter.useRouter();
   var route = vueRouter.useRoute();
+  var router = vueRouter.useRouter();
   var store = vuex.useStore();
   var collectionCrud = vue.inject('vlank-ccrud');
 
 
+  function onClickBackTemplate(){
+    onClickBack(route, router);
+  }
+
+
 
   var localDetail = vue.ref(null);
   var containerMode = vue.ref(route.meta.containerMode);
@@ -1833,13 +2029,6 @@
       : { label: "Valider", icon: "mdi-check" };
   });
 
-  var onClickBack = function () {
-    if (route.meta.mainParentRoutePath) {
-      router.push(route.meta.mainParentRoutePath);
-    } else {
-      router.go(-1);
-    }
-  };
   var onCustomTitle = function (title) {
     customTitle.value = title;
   };
@@ -1856,20 +2045,48 @@
   var onExtraRequestParams = function (extraRequestParamsValue) {
     if (extraRequestParamsValue) { extraRequestParams.value = extraRequestParamsValue; }
   };
+
+  var submitLoading = vue.ref(false);
   var onClickSubmit = function () {
-    collectionCrud
+    submitLoading.value = true;
+    if (route.meta.useSendFiles) {
+      collectionCrud
+      .collectionAction({
+        collectionName: route.meta.collection,
+        action: "send-file",
+        params: Object.assign({}, localDetail.value, extraRequestParams.value),
+        axios_options: {
+          oniti_success_notification_message: 'Modification effectuée'
+        },
+      })
+      .then(function (obj) {
+        submitCallback(obj);
+      }).finally(function () {
+        submitLoading.value = false;
+      });
+    } else {
+      collectionCrud
       .collectionAction({
         collectionName: route.meta.collection,
         action: "update",
         params: Object.assign({}, localDetail.value, extraRequestParams.value),
       })
       .then(function (obj) {
-        if (route.meta.goBackAfterValidation) {
-          onClickBack();
-        }
-        localDetail.value = obj;
+        submitCallback(obj);
+      }).finally(function () {
+        submitLoading.value = false;
       });
+    }
   };
+
+  function submitCallback(obj) {
+    if (route.meta.goBackAfterValidation) {
+      onClickBack(route, router);
+    }
+    localDetail.value = JSON.parse(JSON.stringify(obj));
+    previousLocalDetail.value = JSON.parse(JSON.stringify(obj));
+  }
+
   var onSubscribe = function (mutation, state) {
 
     if (
@@ -1881,15 +2098,27 @@
     }
   };
 
-  vue.onMounted(function () {
+  var route_parameter_name = collectionCrud.getRouteParameterName(route.meta.collection);
+  var actual_route = route;
+  var actual_collection = vue.ref(route.meta.collection);
+  vue.watch(router.currentRoute,function (new_current_route, old_current_route ) {
+    if(new_current_route.meta.collection){
+      actual_route = new_current_route;
+      route_parameter_name = collectionCrud.getRouteParameterName(new_current_route.meta.collection);
+      propsLibelleTitle.value = new_current_route.meta.propsLibelleTitle;
+      actual_collection.value = new_current_route.meta.collection;
+      fetchDetail();
+    }
+  },{deep:true});
+
+  function fetchDetail(){
     var obj;
 
     if (!containerMode.value) {
-      var parameter_route_value = route.params[route_parameter_name];
-
+      var parameter_route_value = actual_route.params[route_parameter_name];
       collectionCrud
         .collectionAction({
-          collectionName: route.meta.collection,
+          collectionName: actual_route.meta.collection,
           action: "detail",
           lazy: true,
           params: ( obj = {}, obj[route_parameter_name] = parameter_route_value, obj ),
@@ -1898,7 +2127,24 @@
           localDetail.value = Object.assign({}, obj);
           $emit("collectionCrudUpdateLocalDetail", localDetail.value);
         });
+    }else {
+      localDetail.value = null;
     }
+  }
+
+  var isLocalDetailUpdated = vue.ref(false);
+  var previousLocalDetail = vue.ref(null);
+
+  vue.watch(localDetail, function (newVal) {
+    if (newVal && !previousLocalDetail.value) {
+      previousLocalDetail.value = JSON.parse(JSON.stringify(newVal));
+    } else {
+      isLocalDetailUpdated.value = JSON.stringify(newVal) !== JSON.stringify(previousLocalDetail.value);
+    }
+  }, {deep:true});
+
+  vue.onMounted(function () {
+    fetchDetail();
     unsubscribe = store.subscribe(onSubscribe);
   });
 
@@ -1908,41 +2154,46 @@
     }
   });
 
-  var route_parameter_name = collectionCrud.getRouteParameterName(route.meta.collection);
 
   return function (_ctx, _cache) {
     return (vue.openBlock(), vue.createBlock(vue.unref(quasar.QPage), null, {
       default: vue.withCtx(function () { return [
         (!containerMode.value)
-          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
-              vue.createElementVNode("div", _hoisted_2$1, [
+          ? (vue.openBlock(), vue.createElementBlock("div", {
+              class: "edit-page-header",
+              key: actual_collection.value
+            }, [
+              vue.createElementVNode("div", _hoisted_1$1, [
                 vue.createVNode(vue.unref(quasar.QBtn), {
-                  onClick: onClickBack,
+                  onClick: onClickBackTemplate,
                   color: "primary",
                   icon: "arrow_back"
                 }),
                 vue.createElementVNode("h2", null, vue.toDisplayString(vue.unref(getTitle)), 1 /* TEXT */)
               ]),
               (!containerMode.value && editablePage.value)
-                ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$1, [
+                ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$1, [
                     vue.createVNode(vue.unref(quasar.QBtn), {
-                      color: "primary",
                       icon: vue.unref(getSubmitBtn).icon,
-                      onClick: onClickSubmit
+                      onClick: onClickSubmit,
+                      disable: !isLocalDetailUpdated.value,
+                      color: isLocalDetailUpdated.value ? 'primary' : 'grey-5',
+                      loading: submitLoading.value
                     }, {
                       default: vue.withCtx(function () { return [
                         vue.createTextVNode(vue.toDisplayString(vue.unref(getSubmitBtn).label), 1 /* TEXT */)
                       ]; }),
                       _: 1 /* STABLE */
-                    }, 8 /* PROPS */, ["icon"])
+                    }, 8 /* PROPS */, ["icon", "disable", "color", "loading"])
                   ]))
                 : vue.createCommentVNode("v-if", true)
             ]))
           : vue.createCommentVNode("v-if", true),
         (localDetail.value)
-          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$1, [
+          ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$1, [
               (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(Components__default["default"])[vue.unref(formComponent)]), {
                 data: localDetail.value,
+                key: localDetail.value[vue.unref(route_parameter_name)],
                 onExtraRequestParams: onExtraRequestParams,
                 onCustomTitle: onCustomTitle,
                 onCustomSubmitBtn: onCustomSubmitBtn,
@@ -1950,7 +2201,7 @@
                 onEditablePage: onEditablePage
               }, null, 40 /* PROPS, HYDRATE_EVENTS */, ["data"]))
             ]))
-          : (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$1, [
+          : (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$1, [
               vue.createVNode(vue.unref(quasar.QSpinner), {
                 class: "loader",
                 color: "accent"
@@ -1994,10 +2245,15 @@
   var $emit = ref$1.emit;
 
 
-  var router = vueRouter.useRouter();
   var route = vueRouter.useRoute();
+  var router = vueRouter.useRouter();
   var collectionCrud = vue.inject('vlank-ccrud');
 
+  function onClickBackTemplate(){
+    onClickBack(route, router);
+  }
+
+
 
 
   var localDetail = vue.ref(null);
@@ -2024,14 +2280,6 @@
       : { label: "Valider", icon: "mdi-check" };
   });
 
-  var onClickBack = function () {
-    if (route.meta.mainParentRoutePath) {
-      router.push(route.meta.mainParentRoutePath);
-    } else {
-      router.go(-1);
-    }
-  };
-
   var onCustomSubmitBtn = function (button) {
     customSubmitBtn.value.label = button.label;
     customSubmitBtn.value.icon = button.icon;
@@ -2043,8 +2291,27 @@
   var onExtraRequestParams = function (extraRequestParamsValue) {
     if (extraRequestParamsValue) { extraRequestParams.value = extraRequestParamsValue; }
   };
+
+  var submitLoading = vue.ref(false);
   var onClickSubmit = function () {
-    collectionCrud
+    submitLoading.value = true;
+    if (route.meta.useSendFiles) {
+      collectionCrud
+      .collectionAction({
+        collectionName: route.meta.collection,
+        action: "send-file",
+        params: Object.assign({}, localDetail.value, extraRequestParams.value),
+      })
+      .then(function (obj) {
+        if (route.meta.goBackAfterValidation) {
+          onClickBack(route, router);
+        }
+        localDetail.value = obj;
+      }).finally(function () {
+        submitLoading.value = false;
+      });
+    } else {
+      collectionCrud
       .collectionAction({
         collectionName: route.meta.collection,
         action: "create",
@@ -2052,10 +2319,14 @@
       })
       .then(function (obj) {
         if (route.meta.goBackAfterValidation) {
-          onClickBack();
+          onClickBack(route, router);
         }
         localDetail.value = obj;
+      }).finally(function () {
+        submitLoading.value = false;
       });
+    }
+
   };
   vue.onMounted(function () {
     collectionCrud
@@ -2078,7 +2349,7 @@
           ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
               vue.createElementVNode("div", _hoisted_2, [
                 vue.createVNode(vue.unref(quasar.QBtn), {
-                  onClick: onClickBack,
+                  onClick: onClickBackTemplate,
                   color: "primary",
                   icon: "arrow_back"
                 }),
@@ -2089,13 +2360,14 @@
                     vue.createVNode(vue.unref(quasar.QBtn), {
                       color: "primary",
                       icon: vue.unref(getSubmitBtn).icon,
-                      onClick: onClickSubmit
+                      onClick: onClickSubmit,
+                      loading: submitLoading.value
                     }, {
                       default: vue.withCtx(function () { return [
                         vue.createTextVNode(vue.toDisplayString(vue.unref(getSubmitBtn).label), 1 /* TEXT */)
                       ]; }),
                       _: 1 /* STABLE */
-                    }, 8 /* PROPS */, ["icon"])
+                    }, 8 /* PROPS */, ["icon", "loading"])
                   ]))
                 : vue.createCommentVNode("v-if", true)
             ]))
@@ -2129,7 +2401,7 @@
   script.__scopeId = "data-v-29e3989a";
   script.__file = "src/components/VlankCreatePage.vue";
 
-  var version = '3.5.11';
+  var version = '3.7.45';
 
   function install (app) {
     app.component(script$2.name, script$2);