Merge remote-tracking branch 'origin/master' into cire16

src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/DatePane.vue

@@ -54,7 +54,7 @@
 </template>
 
 <script>
-import { dateToISO, ISOToDate } from 'ChillMainAssets/chill/js/date.js';
+import { dateToISO, ISOToDate } from 'ChillMainAssets/chill/js/date';
 import AddressRenderBox from 'ChillMainAssets/vuejs/_components/Entity/AddressRenderBox.vue';
 import ActionButtons from './ActionButtons.vue';
 

src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/components/OnTheFly.vue

@@ -146,6 +146,9 @@ export default {
          }
       },
       titleCreate() {
+          if (typeof this.allowedTypes === 'undefined') {
+              return 'onthefly.create.title.default';
+          }
          return this.allowedTypes.every(t => t === 'person')
             ? 'onthefly.create.title.person'
             : this.allowedTypes.every(t => t === 'thirdparty')

src/Bundle/ChillMainBundle/Resources/public/vuejs/PickEntity/PickEntity.vue

@@ -1,5 +1,5 @@
 <template>
-    <ul class="list-suggest remove-items" v-if="picked.length">
+    <ul :class="listClasses" v-if="picked.length && displayPicked">
         <li v-for="p in picked" @click="removeEntity(p)" :key="p.type+p.id">
             <span class="chill_denomination">{{ p.text }}</span>
         </li>
@@ -40,6 +40,15 @@ export default {
         uniqid: {
             type: String,
             required: true,
+        },
+        removableIfSet: {
+            type: Boolean,
+            default: true,
+        },
+        displayPicked: {
+          // display picked entities.
+          type: Boolean,
+          default: true,
         }
     },
     emits: ['addNewEntity', 'removeEntity'],
@@ -78,7 +87,13 @@ export default {
             } else {
                 return appMessages.fr.pick_entity.modal_title_one + trans.join(', ');
             }
-        }
+        },
+        listClasses() {
+            return {
+                'list-suggest': true,
+                'remove-items': this.$props.removableIfSet,
+            };
+        },
     },
     methods: {
         addNewEntity({ selected, modal }) {
@@ -90,6 +105,9 @@ export default {
             modal.showModal = false;
         },
         removeEntity(entity) {
+            if (!this.$props.removableIfSet) {
+                return;
+            }
             this.$emit('removeEntity', entity);
         }
     },

src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/EntityWorkflow/EntityWorkflowVueSubscriber.vue

@@ -20,7 +20,7 @@
 </template>
 
 <script>
-import {makeFetch} from 'ChillMainAssets/lib/api/apiMethods.js';
+import {makeFetch} from 'ChillMainAssets/lib/api/apiMethods.ts';
 
 export default {
     name: "EntityWorkflowVueSubscriber",

src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Modal.vue

@@ -2,57 +2,65 @@
    <transition name="modal">
       <div class="modal-mask">
          <!-- :: styles bootstrap :: -->
-         <div class="modal-dialog" :class="modalDialogClass">
+        <div class="modal fade show" style="display: block" aria-modal="true" role="dialog">
+          <div class="modal-dialog" :class="modalDialogClass">
             <div class="modal-content">
-               <div class="modal-header">
-                  <slot name="header"></slot>
-                  <button class="close btn" @click="$emit('close')">
-                     <i class="fa fa-times" aria-hidden="true"></i></button>
-               </div>
-               <div class="body-head">
+              <div class="modal-header">
+                <slot name="header"></slot>
+                <button class="close btn" @click="$emit('close')">
+                  <i class="fa fa-times" aria-hidden="true"></i></button>
+              </div>
+              <div class="modal-body">
+                <div class="body-head">
                   <slot name="body-head"></slot>
-               </div>
-               <div class="modal-body">
-                  <slot name="body"></slot>
-               </div>
-               <div class="modal-footer" v-if="!hideFooter">
-                  <button class="btn btn-cancel" @click="$emit('close')">{{ $t('action.close') }}</button>
-                  <slot name="footer"></slot>
-               </div>
+                </div>
+                <slot name="body"></slot>
+              </div>
+              <div class="modal-footer" v-if="!hideFooter">
+                <button class="btn btn-cancel" @click="$emit('close')">{{ $t('action.close') }}</button>
+                <slot name="footer"></slot>
+              </div>
             </div>
-         </div>
+          </div>
+        </div>
          <!-- :: end styles bootstrap :: -->
       </div>
    </transition>
 </template>
 
-<script>
+<script lang="ts">
+import {defineComponent} from "vue";
 /*
  *    This Modal component is a mix between Vue3 modal implementation
  *    [+] with 'v-if:showModal' directive:parameter, html scope is added/removed not just shown/hidden
  *    [+] with slot we can pass content from parent component
  *    [+] some classes are passed from parent component
- *    and Bootstrap 4.6 _modal.scss module
+ *    and Bootstrap 5 _modal.scss module
  *    [+] using bootstrap css classes, the modal have a responsive behaviour,
  *    [+] modal design can be configured using css classes (size, scroll)
  */
-export default {
+export default defineComponent({
    name: 'Modal',
    props: {
       modalDialogClass: {
-         type: String,
-         required: false
+         type: Object,
+         required: false,
+         default: {},
       },
       hideFooter: {
          type: Boolean,
-         required: false
+         required: false,
+         default: false
       }
    },
    emits: ['close']
-}
+});
 </script>
 
 <style lang="scss">
+   /**
+    * This is a mask behind the modal.
+    */
    .modal-mask {
       position: fixed;
       z-index: 9998;

src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Notification/NotificationReadToggle.vue

@@ -41,7 +41,7 @@
 </template>
 
 <script>
-import { makeFetch } from 'ChillMainAssets/lib/api/apiMethods.js';
+import { makeFetch } from 'ChillMainAssets/lib/api/apiMethods.ts';
 
 export default {
     name: "NotificationReadToggle",

src/Bundle/ChillMainBundle/Resources/public/vuejs/_js/i18n.ts

@@ -1,27 +1,6 @@
-import { createI18n } from 'vue-i18n'
+import { createI18n } from 'vue-i18n';
+import datetimeFormats from '../i18n/datetimeFormats';
 
-const datetimeFormats = {
-   fr: {
-      short: {
-         year: "numeric",
-         month: "numeric",
-         day: "numeric"
-      },
-      text: {
-         year: "numeric",
-         month: "long",
-         day: "numeric",
-      },
-      long: {
-         year: "numeric",
-         month: "numeric",
-         day: "numeric",
-         hour: "numeric",
-         minute: "numeric",
-         hour12: false
-      }
-   }
-};
 const messages = {
    fr: {
       action: {
@@ -76,11 +55,13 @@ const messages = {
    }
 };
 
-const _createI18n = (appMessages) => {
+const _createI18n = (appMessages: any, legacy?: boolean) => {
    Object.assign(messages.fr, appMessages.fr);
    return createI18n({
+      legacy: typeof legacy === undefined ? true : legacy,
       locale: 'fr',
       fallbackLocale: 'fr',
+      // @ts-ignore
       datetimeFormats,
       messages,
    })

src/Bundle/ChillMainBundle/Resources/public/vuejs/i18n/datetimeFormats.ts

@@ -0,0 +1,27 @@
+export default {
+  fr: {
+    short: {
+      year: "numeric",
+      month: "numeric",
+      day: "numeric"
+    },
+    text: {
+      year: "numeric",
+      month: "long",
+      day: "numeric",
+    },
+    long: {
+      year: "numeric",
+      month: "numeric",
+      day: "numeric",
+      hour: "numeric",
+      minute: "numeric",
+      hour12: false
+    },
+    hoursOnly: {
+      hour: "numeric",
+      minute: "numeric",
+      hour12: false,
+    }
+  }
+};