- Statistiche

- Menu e Sottomenu
- Lista ultimi Movimenti

src/components/CMyElem/CMyElem.vue

@@ -31,65 +31,71 @@
       </div>
       <div
         v-if="myel.type === shared_consts.ELEMTYPE.CARD"
-        :class="myel.span ? '' : ''"
+        class="card-carousel-container"
       >
         <div
           :class="myel.class + (editOn ? ` clEdit` : ``) + getClass()"
           @click="clickOnElem"
+          class="card-carousel"
+          ref="carouselRef"
         >
-          <div v-for="(rec, ind) in myel.listcards" :key="ind">
-            <q-card
-              :class="`my-card center_img bordered ` + myel.class3"
-              :style="rec.style"
+          <q-card
+            v-for="(rec, ind) in myel.listcards"
+            :key="ind"
+            :class="
+              `my-card-elem center_img bordered ` +
+              myel.class3 +
+              (rec.link ? ' titolo_card' : '')
+            "
+            :style="
+              rec.style +
+              `; height: ${myel.heightimg || `300px`} !important; width: ${
+                myel.widthimg || `300px`
+              } !important;`
+            "
+            @click="rec.link ? tools.openUrl(rec.link) : undefined"
+          >
+            <div
+              class="img-container"
+              :style="`height: ${
+                myel.heightimg.replace('px', '') * 0.7
+              }px; overflow: hidden;`"
             >
               <q-img
-                :class="tools.getClassAnim(myel.anim2)"
+                :class="tools.getClassAnim(myel.anim2) + ` ` + myel.class4"
                 :src="tools.getImgFileByElem(myel, rec)"
               />
-              <q-card-section>
-                <div :class="rec.size" :style="`color: ` + rec.color">
-                  {{ rec.alt }}
-                </div>
-                <div
-                  :class="`q-mt-sm q-mb-xs ` + tools.getClassAnim(myel.anim)"
-                  v-html="rec.content"
-                ></div>
-                <div
-                  v-if="rec.description"
-                  class="text-caption"
-                  :style="`color: ` + rec.colorsub"
-                >
-                  {{ rec.description }}
-                </div>
-              </q-card-section>
-
-              <!--<q-card-actions>
-          <q-btn flat color="dark" label="Share"/>
-          <q-btn flat color="primary" label="Book"/>
-
-          <q-space/>
-
-          <q-btn
-            color="grey"
-            round
-            flat
-            dense
-            :icon="expanded ? 'keyboard_arrow_up' : 'keyboard_arrow_down'"
-            @click="expanded = !expanded"
-          />
-        </q-card-actions>-->
-
-              <!--<q-slide-transition>
-            <div v-show="expanded">
-              <q-separator />
-              <q-card-section class="text-subtitle2">
-
-              </q-card-section>
             </div>
-          </q-slide-transition>
-          -->
-            </q-card>
-          </div>
+            <q-card-section>
+              <div :class="rec.size" :style="`color: ` + rec.color">
+                {{ tools.getText(rec.alt) }}
+              </div>
+              <div
+                :class="`q-mt-sm q-mb-xs ` + tools.getClassAnim(myel.anim)"
+                v-html="rec.content"
+              ></div>
+              <div
+                v-if="rec.description"
+                class="text-caption"
+                :style="`color: ` + rec.colorsub"
+              >
+                {{ rec.description }}
+              </div>
+            </q-card-section>
+          </q-card>
+        </div>
+        <div class="swipe-indicator left" v-if="!isAtStart">
+          <q-icon name="chevron_left" size="2rem" color="white" />
+        </div>
+        <div class="swipe-indicator right" v-if="!isAtEnd">
+          <q-icon name="chevron_right" size="2rem" color="white" />
+        </div>
+        <div class="scroll-indicator">
+          <div
+            v-for="(_, index) in myel.listcards"
+            :key="index"
+            :class="['dot', { active: index === activeIndex }]"
+          ></div>
         </div>
       </div>
 
@@ -468,6 +474,10 @@
         <div v-if="editOn" class="elemEdit">CDashGroup</div>
         <CDashGroup></CDashGroup>
       </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.MOVEMENTS">
+        <div v-if="editOn" class="elemEdit">Lista Movimenti</div>
+        <CMovements></CMovements>
+      </div>
       <div v-else-if="myel.type === shared_consts.ELEMTYPE.CSENDRISTO">
         <div v-if="editOn" class="elemEdit">CSendRISTo</div>
         <CSendRISTo></CSendRISTo>