myprojplanet_vite/src/components/CMyActivities/CMyActivities.vue

<template>
  <div
    v-if="!caricato"
    class="fit column no-wrap justify-evenly items-center content-start"
  >
    <q-skeleton type="QAvatar" size="140px" height="140px" animation="fade" />
    <q-card flat bordered style="width: 250px">
      <div class="text-h6">
        <q-skeleton :animation="animation" />
      </div>
      <div class="col-12 text-h7 text-grey text-center">
        {{ username }}
      </div>
      <div class="col-12 text-h7">
        <q-skeleton :animation="animation" />
      </div>

      <div class="col-12 text-h8 q-mt-sm">
        <q-skeleton :animation="animation" />
      </div>
      <div class="col-12 text-h8 q-mt-sm">
        <q-skeleton :animation="animation" />
      </div>
    </q-card>
  </div>
  <div v-else>
    <div v-if="myuser">
      <div v-if="tools.isUserOk() || tools.isLogged()">
        <CNotifAtTop />
      </div>
      <div class="q-gutter-sm q-pa-sm q-pb-md">
        <div
          v-if="myuser && myuser.date_reg"
          class="fit column no-wrap justify-evenly items-center content-start"
        >
          <div class="">
            <q-avatar size="140px">
              <q-img
                :src="myuser.profile ? getImgUser(myuser.profile) : ''"
                :alt="username"
                img-class="imgprofile"
                height="140px"
                @click="showPic = true"
              />
              <q-badge
                v-if="tools.isUserOnline(myuser)"
                align="top"
                floating
                color="green"
                >online</q-badge
              >
            </q-avatar>
          </div>

          <div class="last_access">
            OnLine: <CTimeAgo :datetime="myuser.lasttimeonline" />
          </div>

          <div v-if="myuser.reported">
            <CTitleBanner
              title="⚠️ L'utente è stato Segnalato per comportamento non idoneo."
              bgcolor="bg-red"
              clcolor="text-white"
            >
            </CTitleBanner>
          </div>

          <div v-if="site && site.confpages && site.confpages.showNameSurname">
            <div class="text-h6">
              <span v-if="checkifShow('name') && myuser.name">
                {{ myuser.name }}</span
              >
              <span v-if="checkifShow('surname') && myuser.surname"
                >&nbsp;{{ myuser.surname }}</span
              >
            </div>
          </div>
          <div class="col-12 text-h7 text-blue text-shadow-2">
            {{ myuser.username }}
          </div>
          <br />

          <CContactUser :myuser="myuser" :showBtnActivities="false" />

          <CTitleBanner
            v-if="site.confpages.showCompetenze"
            class=""
            :title="$t('profile.skills')"
            bgcolor="bg-primary"
            clcolor="text-white"
            myclass="myshad"
            :canopen="true"
          >
            <q-tabs v-model="mytab" inline-label dense class="shadow-2">
              <q-tab name="my" icon="far fa-user" />
              <q-tab v-if="isMyRecord(myuser.username)" name="favorite" icon="favorite" content-class="text-red" />
              <q-tab
              v-if="isMyRecord(myuser.username)"
                name="bookmark"
                icon="bookmark"
                content-class="text-teal"
              />
            </q-tabs>

            <q-tab-panels
              v-model="mytab"
              animated
              vertical
              transition-prev="jump-up"
              transition-next="jump-up"
            >
              <q-tab-panel name="my">
                <div
                  v-for="(card, ind) of mycards"
                  :key="ind"
                  :name="card.table"
                >
                  <q-card class="q-my-md">
                    <div v-if="card.table === 'mygroups'">
                      <q-list>
                        <span
                          v-for="(grp, index) in listgroupsfiltered"
                          :key="index"
                          class="q-my-sm q-mx-none"
                          clickable
                        >
                          <CMyGroup
                            :mygrp="grp"
                            :visu="costanti.USER_GROUPS"
                            :noaut="true"
                          >
                          </CMyGroup>
                        </span>
                      </q-list>
                    </div>
                    <div v-else-if="card.table === 'circuits'">
                      <div class="text-h6">{{ card.title }}</div>
                      <q-list>
                        <span
                          v-for="(circuit, index) in listcircuitsfiltered"
                          :key="index"
                          class="q-my-sm q-mx-none"
                          clickable
                        >
                          <CMyCircuit
                            :mycircuit="circuit"
                            :visu="costanti.USER_CIRCUITS"
                            :noaut="true"
                            :username="myuser.username"
                          >
                          </CMyCircuit>
                        </span>
                      </q-list>
                    </div>
                    <div v-else>
                      <CSkill
                        :table="card.table"
                        :filtercustom="filtroutente"
                        :butt_modif_new="isMyRecord(myuser.username)"
                        :visuinpage="true"
                        :noaut="true"
                        :title="card.title"
                      />
                    </div>
                  </q-card>
                </div>
              </q-tab-panel>
              <q-tab-panel v-if="isMyRecord(myuser.username)" name="favorite">
                <div
                  v-for="(card, ind) of mycards"
                  :key="ind"
                  :name="card.table"
                >
                  <q-card class="q-my-md">
                    <div v-if="card.showfavorite && filtrofavorite(card.table)">
                      <CSkill
                        :table="card.table"
                        :filtercustom="filtrofavorite(card.table)"
                        :butt_modif_new="false"
                        :visuinpage="true"
                        :noaut="false"
                        :title="card.title"
                      />
                    </div>
                  </q-card>
                </div>
              </q-tab-panel>
              <q-tab-panel v-if="isMyRecord(myuser.username)" name="bookmark">
                <div
                  v-for="(card, ind) of mycards"
                  :key="ind"
                  :name="card.table"
                >
                  <q-card class="q-my-md">
                    <div v-if="card.showfavorite && filtrobookmark(card.table)">
                      <CSkill
                        :table="card.table"
                        :filtercustom="filtrobookmark(card.table)"
                        :butt_modif_new="false"
                        :visuinpage="true"
                        :noaut="false"
                        :title="card.title"
                      />
                    </div>
                  </q-card>
                </div>
              </q-tab-panel>
            </q-tab-panels>
          </CTitleBanner>
        </div>
      </div>

      <div v-if="!tools.isLogged()">
        <CCheckIfIsLogged></CCheckIfIsLogged>
      </div>

      <q-dialog v-model="showPic" full-height full-width>
        <img :src="getImgUser()" :alt="username" class="full-width" />
      </q-dialog>
      <q-page-sticky position="top-right" :offset="[18, 18]">
        <q-btn
          fab
          glossy
          class="semi-transparent"
          icon="fas fa-link"
          color="primary"
          @click="tools.copyToClip($q, getlinkpage(), true)"
        />
      </q-page-sticky>
    </div>
  </div>
</template>

<script lang="ts" src="./CMyActivities.ts">
</script>
<style lang="scss" scoped>
@import './CMyActivities.scss';
</style>