Others Elements for the Pages

src/components/CMyElem/CMyElem.scss

@@ -463,7 +463,7 @@ body.mobile .landing:before {
   cursor: pointer;
 }
 .selectedElem {
-  border: #200e96 solid 3px !important;
+  border: #b91111 solid 3px !important;
 }
 
 .align_center {
@@ -483,3 +483,16 @@ body.mobile .landing:before {
   justify-content: space-between;
   background-color: green;
 }
+
+.elemEdit{
+  margin: 3px;
+  padding: 3px;
+  background-color: #3fdaff;
+  text-align: center;
+  font-weight: bold;
+}
+
+.elemEdit:hover {
+  border: #11f609 solid 2px;
+  cursor: pointer;
+}

src/components/CMyElem/CMyElem.ts

@@ -19,12 +19,20 @@ import { CEventsCalendar } from '@src/components/CEventsCalendar'
 import { CMyEditor } from '@src/components/CMyEditor'
 import { CMyFieldRec } from '@src/components/CMyFieldRec'
 import { CSelectColor } from '@src/components/CSelectColor'
+import { CMainView } from '@src/components/CMainView'
+import { CDashboard } from '@src/components/CDashboard'
+import { CStatusReg } from '@src/components/CStatusReg'
+import { CTitleBanner } from '@src/components/CTitleBanner'
+import { CCheckIfIsLogged } from '@src/components/CCheckIfIsLogged'
 import { CSelectFontSize } from '@src/components/CSelectFontSize'
+import { CNotifAtTop } from '@src/components/CNotifAtTop'
+import { CPresentazione } from '@src/components/CPresentazione'
 
 import MixinMetaTags from '@/mixins/mixin-metatags'
 import MixinBase from '@/mixins/mixin-base'
 import { useQuasar } from 'quasar'
 import { useI18n } from '@/boot/i18n'
+import { useRouter } from 'vue-router'
 
 
 export default defineComponent({
@@ -33,6 +41,9 @@ export default defineComponent({
     CImgTitle, CTitle, LandingFooter, CEventsCalendar,
     CCardCarousel, COpenStreetMap, CMyPage, CMyPageIntro, CMyEditor, CMyFieldRec,
     CSelectColor, CSelectFontSize, CImgPoster,
+    CCheckIfIsLogged, CStatusReg, CDashboard, CMainView, CNotifAtTop,
+    CPresentazione,
+    CTitleBanner,
   },
   emits: ['selElemClick'],
   props: {
@@ -66,6 +77,7 @@ export default defineComponent({
     const { setmeta, getsrcbyimg } = MixinMetaTags()
     const { setValDb, getValDb } = MixinBase()
 
+    const $router = useRouter()
 
     const $q = useQuasar()
     const { t } = useI18n()
@@ -211,6 +223,10 @@ export default defineComponent({
         return false
     }
 
+    function PagLogin() {
+      $router.replace('/signin')
+    }
+
     onMounted(mounted)
 
     return {
@@ -238,6 +254,8 @@ export default defineComponent({
       showFit,
       getValDb,
       dupElem,
+      globalStore,
+      PagLogin,
     }
   },
 

src/components/CMyElem/CMyElem.vue

@@ -4,8 +4,10 @@
     :class="
       (editOn ? ` clEditDiv` : ``) +
       `` +
+      getClass() +
       (!myel.active ? ` clEditNotActive` : ``)
     "
+    @click="clickOnElem"
   >
     <div>
       <div v-if="myel.type === shared_consts.ELEMTYPE.TEXT">
@@ -22,7 +24,6 @@
               ` ` +
               tools.getClassAnim(myel.anim)
             "
-            @click="clickOnElem"
           >
             {{ myel.container }}
           </div>
@@ -159,8 +160,8 @@
             :speed="myel.speed"
             :elemsText="myel.elemsText"
             :logo="tools.getImgFileByFilename(myel, myel.img)"
-            :logoheight="myel.height.toString()"
-            :logowidth="myel.width.toString()"
+            :logoheight="myel.height ? myel.height.toString() : '100'"
+            :logowidth="myel.width ? myel.width.toString() : '100'"
             :fit="myel.fit"
             :anim="myel.anim"
           >
@@ -287,7 +288,13 @@
         </div>
       </div>
       <div v-else-if="myel.type === shared_consts.ELEMTYPE.CAROUSEL_IMGS">
-        <section :class="($q.dark.isActive ? `bg-black text-white` : `bg-white text-grey-10`) + ` padding_gallery text-center`">
+        <section
+          :class="
+            ($q.dark.isActive
+              ? `bg-black text-white`
+              : `bg-white text-grey-10`) + ` padding_gallery text-center`
+          "
+        >
           <div
             :class="myel.class + (editOn ? ` clEdit` : ``) + getClass()"
             @click="clickOnElem"
@@ -420,16 +427,171 @@
         </section>
       </div>
       <div v-else-if="myel.type === shared_consts.ELEMTYPE.CALENDAR">
+        <div v-if="editOn" class="elemEdit">Calendario Eventi</div>
         <CEventsCalendar :mysingleevent="null" :showfirstN="myel.number || 3">
         </CEventsCalendar>
       </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.MAINVIEW">
+        <div v-if="editOn" class="elemEdit">CMainView</div>
+        <CMainView></CMainView>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.DASHBOARD">
+        <div v-if="editOn" class="elemEdit">CDashboard</div>
+        <CDashboard></CDashboard>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.STATUSREG">
+        <div v-if="editOn" class="elemEdit">CStatusReg</div>
+        <CStatusReg> </CStatusReg>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.CHECKIFISLOGGED">
+        <div v-if="editOn" class="elemEdit">CCheckIfIsLogged</div>
+        <CCheckIfIsLogged></CCheckIfIsLogged>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.INFO_VERSION">
+        <div>Versione: {{ tools.getvers() }}</div>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.BOTT_CONDIVIDI">
+        <div class="row justify-evenly items-center q-pa-sm q-ma-sm">
+          <q-btn
+            icon="fas fa-share-alt"
+            color="blue"
+            type="a"
+            size="md"
+            rounded
+            :label="$t('reg.link_reg_and_msg')"
+            @click="
+              tools.sendMsgTelegramCmd(
+                $q,
+                $t,
+                shared_consts.MsgTeleg.SHARE_MSGREG,
+                true
+              )
+            "
+          >
+          </q-btn>
+        </div>
+      </div>
       <div v-else-if="myel.type === shared_consts.ELEMTYPE.CHECK_EMAIL">
+        <div v-if="editOn" class="elemEdit">
+          Msg di Controllo Verifica Email
+        </div>
         <div class="q-pa-md q-gutter-md">
           <div v-if="tools.isLogged() && !isVerified" class="text-verified">
             {{ $t('components.authentication.email_verification.link_sent') }}
           </div>
         </div>
       </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.PRESENTAZIONE">
+        <div v-if="editOn" class="elemEdit">Pagina di Presentazione</div>
+        <CPresentazione></CPresentazione>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.NOTIFATTOP">
+        <div v-if="editOn" class="elemEdit">Notifiche in Cima</div>
+        <CNotifAtTop></CNotifAtTop>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.CHECKTESTENV">
+        <div v-if="editOn" class="elemEdit">Check Sito di Test</div>
+        <q-banner
+          v-if="tools.isTest()"
+          rounded
+          dense
+          class="bg-negative text-white"
+          color="primary q-title"
+          style="text-align: center"
+        >
+          <template v-slot:avatar>
+            <q-icon
+              name="fas fa-exclamation-triangle"
+              color="yellow"
+              size="xs"
+            />
+          </template>
+          <span class="mybanner"
+            >Questo è l'AMBIENTE DI TEST !<br />
+            Solo per prove.</span
+          >
+        </q-banner>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.CHECKNEWVERSION">
+        <div v-if="editOn" class="elemEdit">Controllo Nuova Versione</div>
+        <q-banner
+          v-if="globalStore.isNewVersionAvailable"
+          rounded
+          dense
+          class="bg-green text-white"
+          color="primary q-title"
+          style="text-align: center"
+        >
+          <template v-slot:avatar>
+            <q-icon
+              name="fas fa-exclamation-triangle"
+              color="yellow"
+              size="xs"
+            />
+          </template>
+          <span class="mybanner"
+            >Per Aggiornare alla nuova versione, chiudere e riaprire la APP (o
+            il browser)</span
+          >
+        </q-banner>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.BTN_REG">
+        <q-btn
+          rounded
+          size="md"
+          color="primary"
+          to="/signup"
+          :label="$t('reg.submit')"
+        >
+        </q-btn>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.BTN_REG_BYBOT">
+        <q-btn
+          type="a"
+          rounded
+          size="lg"
+          color="primary"
+          href="/bot"
+          :label="$t('reg.submit')"
+          :class="
+            myel.class +
+            (editOn ? ` clEdit` : ``) +
+            getClass() +
+            ` ` +
+            tools.getClassAnim(myel.anim)
+          "
+        >
+        </q-btn>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.BTN_LOGIN">
+        <q-btn
+          :class="
+            myel.class +
+            (editOn ? ` clEdit` : ``) +
+            getClass() +
+            ` ` +
+            tools.getClassAnim(myel.anim)
+          "
+          rounded
+          size="lg"
+          color="primary"
+          @click="PagLogin"
+        >
+          {{ $t('login.enter') }}
+        </q-btn>
+      </div>
+      <div v-else-if="myel.type === shared_consts.ELEMTYPE.CHART">
+        <div v-if="editOn">Chart</div>
+        <!--<CChartMap
+            title="Mappa"
+            subtitle="cartina..."
+            serie1="Serie 1"
+          >
+          </CChartMap>-->
+      </div>
+      <div v-if="editOn">
+        <div class="q-ma-md"></div>
+      </div>
     </div>
   </div>
 </template>