- Statistiche

- Menu e Sottomenu
- Lista ultimi Movimenti

src/components/CMyElem/CMyElem.ts

@@ -1,6 +1,6 @@
 import {
   computed,
-  defineComponent, onMounted, PropType, ref, toRef, watch,
+  defineComponent, onMounted, PropType, ref, toRef, watch, nextTick,
 } from 'vue'
 
 import { ICoordGPS, IMyCard, IMyElem, IMyPage, IOperators, ISocial } from '@src/model'
@@ -34,6 +34,7 @@ import { CMyProfileTutorial } from '@src/components/CMyProfileTutorial'
 import { CSendRISTo } from '@src/components/CSendRISTo'
 import { CDashboard } from '@src/components/CDashboard'
 import { CDashGroup } from '@src/components/CDashGroup'
+import { CMovements } from '@src/components/CMovements'
 import { CCheckAppRunning } from '@src/components/CCheckAppRunning'
 import { CStatusReg } from '@src/components/CStatusReg'
 import { CTitleBanner } from '@src/components/CTitleBanner'
@@ -65,7 +66,7 @@ export default defineComponent({
     CTitleBanner, CShareSocial, CCheckAppRunning, CRegistration,
     CVisuVideoPromoAndPDF, CECommerce, CCatalogo, CAITools,
     CMapComuni, CMapUsers, CMapGetCoordinates, CMapEditAddressByCoord,
-    CDashGroup,
+    CDashGroup, CMovements,
     // ,  //CMapMarker, 
   },
   emits: ['selElemClick'],
@@ -125,6 +126,11 @@ export default defineComponent({
 
     const coordaddr = ref(<ICoordGPS>{ address: '', coordinates: [0, 0] })
 
+    const carouselRef = ref(<any>null)
+    const isAtStart = ref(true)
+    const isAtEnd = ref(false)
+    const activeIndex = ref(0)
+
     watch(() => myel.value.order, (value, oldval) => {
       mounted()
     })
@@ -173,14 +179,28 @@ export default defineComponent({
       disableSave.value = false
     }
 
+    const checkScrollPosition = () => {
+      const container = carouselRef.value
+      if (!container || !myel.value || !myel.value.listcards) return
+
+      isAtStart.value = container.scrollLeft <= 0
+      isAtEnd.value = container.scrollLeft + container.clientWidth >= container.scrollWidth - 1
+
+      const cardWidth = container.scrollWidth / myel.value.listcards.length
+      activeIndex.value = Math.round(container.scrollLeft / cardWidth)
+    }
+
     function mounted() {
-      //console.log('mounted elem ')
-      //console.log(props.myelem.type)
       myel.value = props.myelem
       neworder.value = props.myelem.order
 
       if (props.myelem)
         newtype.value = props.myelem.type
+
+      nextTick(() => {
+        checkScrollPosition()
+        carouselRef.value?.addEventListener('scroll', checkScrollPosition)
+      })
     }
 
     function clickOnElem() {
@@ -271,6 +291,10 @@ export default defineComponent({
       clickshare,
       isAppRunning,
       coordaddr,
+      isAtStart,
+      isAtEnd,
+      activeIndex,
+      carouselRef,
     }
   },