UNAPLLYREC-26 : Sauvegarde seulement après la perte de focus. Pour l'éditeur,...

UNAPLLYREC-26 : Sauvegarde seulement après la perte de focus. Pour l'éditeur, le fonctionnnement reste le même mais on allonge le temps avant la sauvegarde.

src/main/webapp/app/components/forms/editor/editor.component.ts

@@ -18,4 +18,20 @@ export default class Editor extends AbstractFormComponent {
     toolbar: [['Bold', 'Italic'], ['Link', 'Unlink'], ['BulletedList'], ['Undo', 'Redo']],
     language: 'fr',
   };
+
+  public editorValue = '';
+
+  constructor() {
+    super();
+    this.editorValue = this.currentValue;
+    if (!this.editorValue) {
+      this.editorValue = '';
+    }
+  }
+
+  public saveEditor() {
+    if (this.currentValue !== this.editorValue) {
+      this.currentValue = this.editorValue;
+    }
+  }
 }

src/main/webapp/app/components/forms/editor/editor.vue

 <template>
   <div :class="['mb-8', disabled ? 'opacity-40' : '']">
     <oa-label :id="id" :label="label" :required="required" v-if="label" />
-    <ckeditor :id="id" v-model="currentValue" :config="editorConfig" :disabled="disabled" :aria-describedby="helpTextId"></ckeditor>
+    <ckeditor :id="id" @input="saveEditor" v-model="editorValue" :config="editorConfig" :disabled="disabled" :aria-describedby="helpTextId" :throttle="800"></ckeditor>
     <help-text v-if="helpText" :id="helpTextId" :text="helpText" />
   </div>
 </template>

src/main/webapp/app/components/forms/input/oa-input.component.ts

@@ -14,4 +14,8 @@ import { Prop } from 'vue-property-decorator';
 export default class OaInput extends AbstractEditableComponent {
   @Prop()
   public type: string;
+
+  public save(event) {
+    this.currentValue = event.target.value;
+  }
 }

src/main/webapp/app/components/forms/input/oa-input.vue

@@ -10,7 +10,8 @@
       :placeholder="placeholder"
       :required="required"
       :disabled="disabled"
-      v-model="currentValue"
+      @change="save"
+      :value="currentValue"
       :minlength="minlength"
       :maxlength="maxlength"
     />