cnm/src/root/home/home.vue

<template>
  <q-page>
    <CMyPage title="">
      <!--<span>{{
          setmeta({
            title: 'Home',
            description: $t('msg.myAppDescription'),
            keywords: $t('msg.keywords_base')
          })
        }}
      </span>-->

      <div class="landing">
        <div v-if="!isLogged">
          <div style="height: 15px;">
          </div>
          <div class="text-center">
            <q-img src="statics/images/background.jpg" class="logo"></q-img>
          </div>
        </div>

        <q-banner class="bg-positive text-white boldhigh"
                  style="text-align: center; ">
          Benvenuti nella Nuova App della Comunità Nuovo Mondo... <br>
          in costruzione...
        </q-banner>

        <div v-if="!tools.sito_online(true)" class="row text-h4 text-center bg-warning">
          {{ $t('otherpages.sito_offline') }}
        </div>

        <div v-if="isLogged">
          <CVerifyEmail v-if="!isEmailVerified">

          </CVerifyEmail>

          <!--<CVerifyTelegram v-if="TelegCode || !TelegVerificato">

          </CVerifyTelegram>-->

        </div>
        <div v-else>
          <div v-if="!isLogged && static_data.functionality.ENABLE_REGISTRATION" align="center"
               style="margin:20px;">
            <q-btn rounded size="lg" color="primary" @click="openrighttoolbar">{{ $t('login.enter') }}
            </q-btn>
          </div>

          <div v-if="!isLogged && static_data.functionality.ENABLE_REGISTRATION" align="center" style="margin:20px;">
            <q-btn rounded size="lg" color="primary" to="/signup">{{ $t('reg.submit') }}
            </q-btn>
          </div>
        </div>

        <q-tabs
          v-model="tab"
          dense
          class="bg-blue text-white shadow-2"
          indicator-color="white"
          align="center"
          narrow-indicator
          :breakpoint="350"
          @input="changetab"
        >
          <q-tab name="guida" icon="fas fa-check" :label="$t('pages.home')"></q-tab>
          <q-tab v-if="isLogged && isSocio" name="prodotti" icon="fas fa-shopping-cart"
                 :label="$t('pages.products')"></q-tab>
          <q-tab v-if="isLogged" name="collabora" icon="fas fa-users" :label="$t('pages.collabora')"></q-tab>
          <!--<q-tab name="zoom" icon="fas fa-video" :label="$t('pages.nextzoom')"></q-tab>-->
          <!--<q-tab name="statistiche" icon="fas fa-chart-line" :label="$t('pages.status')"></q-tab>-->

        </q-tabs>

        <q-tab-panels v-model="tab" animated>
          <q-tab-panel name="guida">
            <div class="q-ma-xs q-pa-xs text-center rounded-borders">
              <div v-if="isLogged">
                <div>
                  <!--<q-field-->
                  <!--v-if="getPermission() === 'granted'"-->
                  <!--icon="notifications"-->
                  <!--class="shadow"-->
                  <!--:label="$t('notification.titlegranted')"-->
                  <!--:helper="$t('notification.statusnot')">-->
                  <!--</q-field>-->
                  <q-field
                    v-if="NotServiceWorker()"
                    class="shadow"
                    icon="notifications"
                    label="Service Worker not present"
                  >
                  </q-field>
                </div>

                <div>
                  <q-btn v-if="getPermission() !== 'granted'"
                         class="enable-notifications shadow"
                         color="primary" rounded
                         size="md"
                         icon="notifications" @click="tools.askfornotification(mythis)"
                         :label="$t('notification.ask')"/>
                  <!--<q-btn v-if="getPermission() === 'granted'" class="enable-notifications" color="primary" rounded size="lg" icon="notifications" @click="showNotificationExample" label="Send Notification"/>-->
                  <!--<q-btn v-if="getPermission() === 'granted'" class="enable-notifications" color="secondary" rounded size="lg" icon="notifications" @click="createPushSubscription" label="Create Push Subscription !"/>-->

                </div>
              </div>


              <q-btn class="enable-notifications shadow add-button" v-if="showbuttonHS" @click="addtoHomeScreen"
                     color="primary" rounded
                     size="md"
                     icon="fas fa-plus"
                     label="Aggiungi alle tue Applicazioni">
              </q-btn>


              <CEventsCalendar :mysingleevent="null" :showfirstN="getValDb('SHOW_LAST_EVENTS', false, 3)">

              </CEventsCalendar>

              <br>

              <div class="q-pt-md q-pl-sm">
                <div class="text-body2 text-italic text-grey">Versione App {{ getenv('APP_VERSION') }}</div>
              </div>
            </div>

          </q-tab-panel>
          <q-tab-panel name="prodotti">
            <CECommerce>

            </CECommerce>
          </q-tab-panel>
          <q-tab-panel name="collabora">
            <CShareWithUs></CShareWithUs>

          </q-tab-panel>
          <q-tab-panel name="zoom">
            <CNextZoom>

            </CNextZoom>

          </q-tab-panel>
          <q-tab-panel name="statistiche">
            <CStatusReg>

            </CStatusReg>

          </q-tab-panel>
        </q-tab-panels>


      </div>
    </CMyPage>
  </q-page>
</template>

<script lang="ts" src="./home.ts">
</script>

<style lang="scss" scoped>
@import './home.scss';
</style>