Web Editor home made

src/components/CMyEditElem/CMyEditElem.ts

@@ -2,7 +2,7 @@ import {
   defineComponent, onMounted, PropType, ref, toRef, watch,
 } from 'vue'
 
-import { ILabelValue, IMyElem, IMyPage, IOperators } from '@src/model'
+import { IImgGallery, ILabelValue, IMyCard, IMyElem, IMyPage, IOperators } from '@src/model'
 import { useGlobalStore } from '@store/globalStore'
 
 import { CImgTitle } from '../CImgTitle/index'
@@ -26,13 +26,15 @@ import { useQuasar } from 'quasar'
 import { useI18n } from '@/boot/i18n'
 import { emitKeypressEvents } from 'readline'
 import { costanti } from '@costanti'
-
+import objectId from '@src/js/objectId'
 
 export default defineComponent({
   name: 'CMyEditElem',
-  components: { CImgTitle, CTitle, LandingFooter, CEventsCalendar,
+  components: {
+    CImgTitle, CTitle, LandingFooter, CEventsCalendar,
     CCardCarousel, COpenStreetMap, CMyPage, CMyPageIntro, CMyEditor, CMyFieldRec,
-    CSelectColor, CSelectFontSize },
+    CSelectColor, CSelectFontSize
+  },
   emits: ['saveElem'],
   props: {
     myelem: {
@@ -74,7 +76,7 @@ export default defineComponent({
     const elemChanged = ref(false)
     const enableAdd = ref(true)
 
-    const neworder = ref(<number|undefined>0)
+    const neworder = ref(<number | undefined>0)
 
     const myel = toRef(props, 'myelem')
     const newtype = ref(<any>'')
@@ -87,13 +89,6 @@ export default defineComponent({
       return globalStore.disciplines.filter((rec: any) => rec.showinhome)
     }
 
-    function getheightgallery() {
-      if (tools.isMobile())
-        return '400px'
-      else
-        return '600px'
-    }
-
     function saveElem(exit?: boolean) {
       // Save Elem record
       const myelem = props.myelem
@@ -165,7 +160,7 @@ export default defineComponent({
 
     }
 
-    function modifElem(value: any) {
+    function modifElem() {
       disableSave.value = false
       elemChanged.value = true
     }
@@ -174,7 +169,7 @@ export default defineComponent({
       neworder.value = props.myelem.order
 
       arrPages.value = []
-      arrPages.value.push({label: '[Vuoto]', path: ''})
+      arrPages.value.push({ label: '[Vuoto]', path: '' })
       for (const page of globalStore.mypage) {
 
         const rec = {
@@ -198,8 +193,9 @@ export default defineComponent({
     function addNewCard() {
       if (!myel.value.listcards)
         myel.value.listcards = []
-      myel.value.listcards.push({ imagefile: '', alt: '', description: '' })
-      modifElem(true)
+
+      myel.value.listcards.push({ _id: objectId(), imagefile: '', alt: '', description: '' })
+      modifElem()
     }
 
     function getClass() {
@@ -222,13 +218,37 @@ export default defineComponent({
         return false
     }
 
+    function delRecCard(idcard: string, myel: IMyElem) {
+      //
+      if (myel.listcards)
+        myel.listcards = myel.listcards.filter((card: IMyCard) => card._id !== idcard)
+
+    }
+
+    function saveCard(recpass: IMyCard, myval: any) {
+      if (props.myelem.type === shared_consts.ELEMTYPE.CARD) {
+        if (props.myelem.listcards) {
+          props.myelem.listcards.forEach((rec: IMyCard) => {
+            if (recpass._id === rec._id) {
+              rec.imagefile = myval
+            }
+          })
+        }
+      }
+      modifElem()
+    }
+
+    function updateElem(myvalue: any) {
+      myel.value = myvalue
+      modifElem()
+    }
+
     onMounted(mounted)
 
     return {
       tools,
       shared_consts,
       getArrDisciplines,
-      getheightgallery,
       slide,
       slide2,
       animare,
@@ -253,6 +273,9 @@ export default defineComponent({
       addNewCard,
       arrPages,
       costanti,
+      delRecCard,
+      saveCard,
+      updateElem,
     }
   },