- aggiornato l'Editor HTML

src/components/CMyEditElem/CMyEditElem.ts

@@ -1,5 +1,5 @@
 import {
-  defineComponent, onMounted, PropType, ref, toRef, watch,
+  defineComponent, onMounted, PropType, computed, ref, toRef, watch,
 } from 'vue'
 
 import { IElemText, IImgGallery, ILabelValue, IMyCard, IMyElem, IMyPage, IOperators } from '@src/model'
@@ -39,7 +39,7 @@ export default defineComponent({
     CCardCarousel, COpenStreetMap, CMyPage, CMyPageIntro, CMyEditor, CMyFieldRec,
     CSelectColor, CSelectFontSize, CSelectImage, CImgPoster, CSelectAnimation
   },
-  emits: ['saveElem', 'selElemClick'],
+  emits: ['saveElem', 'selElemClick', 'toggleSize', 'deleteElem'],
   props: {
     myelem: {
       type: Object as PropType<IMyElem>,
@@ -90,6 +90,7 @@ export default defineComponent({
     const myel = toRef(props, 'myelem')
     const newtype = ref(<any>'')
     const visuadd = ref(false)
+    const direzadd = ref(1)
 
     watch(() => myel.value.order, (value, oldval) => {
       mounted()
@@ -108,29 +109,69 @@ export default defineComponent({
           // OK
           disableSave.value = true
           emit('saveElem', myelem)
+
           if (exit)
             elemChanged.value = false
         }
       })
     }
 
-    function addNewElem(order?: number) {
+    function getNewOrderByThisElem() {
+      let myelem = props.myelem
+      let neword = 0
+      if (myelem) {
+        neword = myelem.order!
+        const recfound = globalStore.getMyElemNextThisElemId(props.path, myelem._id!)
+
+        if (recfound) {
+          neword = Math.round((recfound.order! + myelem.order!) / 2)
+        }
+      }
+      return neword
+    }
+
+    async function addNewElem(elemsel: any, direz: number) {
 
       visuadd.value = false
 
-      let newrec = globalStore.prepareAddNewElem(order, $q, t, props.myelem, newtype.value)
+      let neword = 0
+
+      let recfound = null
+
+      if (direz === -1) {  // Sopra
+        // ottieni l'elemento precedente, mantenendo l'ordinamento
+        recfound = globalStore.getMyElemPrecThisElemId(props.path, elemsel._id)
+      } else if (direz === 1) {  // Sotto
+        // ottieni l'elemento precedente, mantenendo l'ordinamento
+        recfound = globalStore.getMyElemNextThisElemId(props.path, elemsel._id)
+      }
+
+      if (recfound) {
+        // get the middle of the order number between thie 2 elements
+        neword = Math.round((recfound.order + elemsel.order) / 2)
+      }
+
+      let newrec = await globalStore.prepareAddNewElem(neword, $q, t, props.myelem, newtype.value)
 
       emit('selElemClick', newrec)
+
+      // emit('updateAll', newrec)
     }
 
-    function dupElem(order?: number) {
+    async function dupElem(order?: number) {
 
-      const newrec = props.myelem
+      const newrec: IMyElem = { ...props.myelem }
 
       newrec._id = undefined
-      newrec.order = order ? order : newrec.order! + 10
+      newrec.order = getNewOrderByThisElem()
+      if (newrec.type === shared_consts.ELEMTYPE.HTML) {
+        newrec.containerHtml = 'Copia di ' + newrec.containerHtml
+      }
+
+      const mynewelem = await globalStore.addNewElem($q, t, newrec)
+
+      emit('selElemClick', mynewelem)
 
-      globalStore.addNewElem($q, t, newrec)
     }
 
     function delElem() {
@@ -151,6 +192,7 @@ export default defineComponent({
           if (ris) {
             // OK
             disableSave.value = true
+            emit('deleteElem', props.myelem)
           }
         })
       })
@@ -292,6 +334,73 @@ export default defineComponent({
       modifElem()
     }
 
+    function toggleSize() {
+      emit('toggleSize', null)
+    }
+
+    const orderOptions = computed(() => {
+      const options = []
+
+      for (let i = 0; i <= 100; i += 1) {
+        options.push({ label: i.toString(), value: i });
+      }
+
+      for (let i = 100; i <= 1000; i += 10) {
+        options.push({ label: i.toString(), value: i });
+      }
+
+      return options;
+    });
+
+    function addOrder(rec: any) {
+      neworder.value = rec
+    }
+
+    async function moveElem(direz: any) {
+      let myelem = props.myelem
+
+      const elemprec = globalStore.getMyElemPrecThisElemId(props.path, myelem._id)
+      const elemnext = globalStore.getMyElemNextThisElemId(props.path, myelem._id!)
+
+      let neworder = 0
+      let oldorder = myelem.order!
+
+      if (direz === -1) {
+        // UP
+        neworder = elemprec.order!
+        elemprec.order = oldorder
+
+        if (oldorder === elemprec.order!) {
+          const elemprec2 = globalStore.getMyElemPrecThisElemId(props.path, elemprec._id!)
+
+          neworder = (elemprec2.order! + elemprec.order) / 2
+          elemprec.order = Math.round((oldorder + neworder) / 2)
+        }
+
+        await globalStore.saveMyElem($q, t, elemprec)
+        emit('saveElem', elemprec)
+      } else if (direz === 1) {
+        // DOWN
+        neworder = elemnext.order!
+        elemnext.order = oldorder
+
+        if (oldorder === elemnext.order!) {
+          const elemnext2 = globalStore.getMyElemNextThisElemId(props.path, elemnext._id!)
+
+          neworder = (elemnext2.order! + elemnext.order) / 2
+          elemnext.order = Math.round((oldorder + neworder) / 2)
+        }
+
+
+        await globalStore.saveMyElem($q, t, elemnext)
+        emit('saveElem', elemnext)
+      }
+
+      myelem.order = neworder
+      await globalStore.saveMyElem($q, t, myelem)
+      emit('saveElem', myelem)
+    }
+
     onMounted(mounted)
 
     return {
@@ -334,6 +443,11 @@ export default defineComponent({
       Products,
       generateSizeOptions,
       updateSizeWidth,
+      direzadd,
+      toggleSize,
+      orderOptions,
+      addOrder,
+      moveElem,
     }
   },