Aggiunto la pagina dei Beni e Servizi della persona singola, separata dal profilo.

src/views/user/editprofile/editprofile.vue

@@ -81,19 +81,6 @@
       </div>
     </CTitleBanner>
 
-    <!--
-    <CTitleBanner
-      class="q-pa-xs" title="Competenze Personali (Offerte)" bgcolor="bg-primary" clcolor="text-white"
-      myclass="myshad" :canopen="true">
-
-      <CSkill
-        :filtercustom="filtroutente">
-
-      </CSkill>
-
-
-    </CTitleBanner>
-    -->
 
     <CTitleBanner
       class="q-pa-xs"

src/views/user/myactivities/myactivities.scss

@@ -0,0 +1,18 @@
+.profile {
+  width: 100%;
+  margin: 0 auto;
+  max-width: 450px;
+}
+
+.myrow{
+  display: flex;
+  @media (max-width: 600px) {
+    flex-flow: column;
+  }
+}
+
+.qualifica{
+  border: solid 2px #4198ef;
+  border-radius: 1rem;
+  padding: 5px;
+}

src/views/user/myactivities/myactivities.ts

@@ -0,0 +1,206 @@
+import { CMyFieldDb } from '@/components/CMyFieldDb'
+import { CMyFieldRec } from '@/components/CMyFieldRec'
+import { CTitleBanner } from '@/components/CTitleBanner'
+import { CProfile } from '@/components/CProfile'
+import { CLabel } from '@/components/CLabel'
+import { CCopyBtn } from '@/components/CCopyBtn'
+import { CSkill } from '@/components/CSkill'
+import { CDateTime } from '@/components/CDateTime'
+import { CMyGroup } from '@/components/CMyGroup'
+import { CMyCircuit } from '@/components/CMyCircuit'
+import { CNotifAtTop } from '@src/components/CNotifAtTop'
+import { CSendCoins } from '@/components/CSendCoins'
+import { CMyUser } from '@/components/CMyUser'
+import { CUserNonVerif } from '@/components/CUserNonVerif'
+import { tools } from '@store/Modules/tools'
+import { computed, defineComponent, onMounted, ref, watch } from 'vue'
+import { useUserStore } from '@store/UserStore'
+import { useRoute, useRouter } from 'vue-router'
+import { useGlobalStore } from '@store/globalStore'
+import { useI18n } from '@/boot/i18n'
+import { toolsext } from '@store/Modules/toolsext'
+import { useQuasar } from 'quasar'
+import { costanti } from '@costanti'
+import { ICircuit, IMyCircuit, IMyGroup, IUserFields } from 'model'
+import { shared_consts } from '@/common/shared_vuejs'
+import { static_data } from '@/db/static_data'
+import { fieldsTable } from '@store/Modules/fieldsTable'
+import { useNotifStore } from '@store/NotifStore'
+import MixinUsers from '@/mixins/mixin-users'
+
+
+export default defineComponent({
+  name: 'myactivities',
+  components: {
+    CProfile, CTitleBanner, CMyFieldDb, CSkill, CDateTime, CCopyBtn, CUserNonVerif, CMyFieldRec, CMyUser,
+    CMyGroup, CLabel, CMyCircuit, CSendCoins, CNotifAtTop
+  },
+  props: {},
+  setup() {
+    const userStore = useUserStore()
+    const globalStore = useGlobalStore()
+    const $route = useRoute()
+    const $q = useQuasar()
+    const { t } = useI18n()
+
+    const site = ref(globalStore.site)
+
+    const { getRefLink } = MixinUsers()
+
+    const animation = ref('fade')
+
+    const username = computed(() => $route.params.username ? $route.params.username.toString() : userStore.my.username)
+    const idnotif = computed(() => $route.query.idnotif ? $route.query.idnotif.toString() : '')
+
+    const filtroutente = ref(<any[]>[])
+    const showPic = ref(false)
+    const caricato = ref(false)
+    const showsendCoinTo = ref(false)
+
+    const myuser = ref(<IUserFields | null>null)
+
+    const actualcard = ref('mygoods')
+
+    const notifStore = useNotifStore()
+
+    const mycards = computed(() => {
+      return costanti.MAINCARDS.filter((rec: any) => rec.table)
+    })
+    const optionsMainCards = ref({})
+
+    const listgroupsfiltered = ref(<IMyGroup[]>[])
+    const listcircuitsfiltered = ref(<IMyCircuit[]>[])
+
+
+    function profile() {
+      return userStore.my.profile
+    }
+
+    function myusername() {
+      return userStore.my.username
+    }
+
+    async function loadProfile() {
+      console.log('loadProfile...', username.value)
+      try {
+        // Carica il profilo di quest'utente
+        if (username.value) {
+          await userStore.loadUserProfile({ username: username.value, idnotif: idnotif.value }).then((ris) => {
+            console.log('loadUserProfile = ', ris)
+            myuser.value = ris
+            if (myuser.value) {
+              filtroutente.value = [{ userId: myuser.value._id }]
+              notifStore.setAsRead(idnotif.value)
+
+              try {
+                listgroupsfiltered.value = globalStore.mygroups.filter((grp: IMyGroup) => myuser.value!.profile.mygroups.findIndex((rec: IMyGroup) => rec.groupname === grp.groupname) >= 0)
+              } catch (e) {
+                listgroupsfiltered.value = []
+              }
+
+              try {
+                listcircuitsfiltered.value = myuser.value.profile.mycircuits
+              } catch (e) {
+                listcircuitsfiltered.value = []
+              }
+
+            }
+          })
+
+        }
+        caricato.value = true
+
+        optionsMainCards.value = tools.getoptionsMainCards(true)
+      }catch (e) {
+        console.error('ERR loadProfile', e)
+      }
+    }
+
+    watch(() => username.value, (to: any, from: any) => {
+      loadProfile()
+    })
+
+    watch(() => actualcard.value, (to: any, from: any) => {
+      loadProfile()
+    })
+
+    function mounted() {
+      loadProfile()
+    }
+
+    function getImgUser() {
+      if (myuser.value)
+        return userStore.getImgByProfile(myuser.value)
+      else
+        return ''
+    }
+
+    function checkifShow(col: string) {
+      //++Todo: checkifShow Permessi !
+      return true
+    }
+
+    function getLinkUserTelegram() {
+
+      if (myuser.value) {
+        if (!!myuser.value.profile.username_telegram) {
+          return 'https://t.me/' + myuser.value.profile.username_telegram
+        }
+      } else {
+        return ''
+      }
+    }
+
+    function getLinkWebSite() {
+      if (myuser.value) {
+        let site = myuser.value.profile.website!
+        if (site) {
+          if (!site.startsWith('http')) {
+            site = 'https://' + site
+          }
+        }
+        return site
+      } else {
+        return ''
+      }
+    }
+
+    function isMyRecord(username: string) {
+      return username === userStore.my.username
+    }
+
+    onMounted(mounted)
+
+    return {
+      username,
+      profile,
+      tools,
+      costanti,
+      myuser,
+      shared_consts,
+      getImgUser,
+      checkifShow,
+      getLinkUserTelegram,
+      getLinkWebSite,
+      filtroutente,
+      showPic,
+      myusername,
+      userStore,
+      t,
+      static_data,
+      animation,
+      isMyRecord,
+      getRefLink,
+      fieldsTable,
+      mycards,
+      actualcard,
+      caricato,
+      listgroupsfiltered,
+      idnotif,
+      showsendCoinTo,
+      site,
+      listcircuitsfiltered,
+      optionsMainCards,
+    }
+  }
+})

src/views/user/myactivities/myactivities.vue

@@ -0,0 +1,160 @@
+<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-if="tools.isUserOk() || tools.isLogged()">
+    <div v-if="myuser">
+      <CNotifAtTop />
+      <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="getImgUser()"
+                :alt="username"
+                img-class="imgprofile"
+                height="140px"
+                @click="showPic = true"
+              />
+            </q-avatar>
+          </div>
+          <div v-if="site.confpages.showNameSurname">
+            <div class="text-h6">
+              <span v-if="checkifShow('name')"> {{ myuser.name }}</span> <span v-if="checkifShow('surname')">{{
+                myuser.surname
+              }}</span>
+            </div>
+          </div>
+          <div class="col-12 text-h7 text-blue text-shadow-2">
+            {{ myuser.username }}
+          </div>
+
+
+          <CTitleBanner
+            v-if="site.confpages.showCompetenze"
+            class=""
+            :title="$t('profile.skills')"
+            bgcolor="bg-primary"
+            clcolor="text-white"
+            myclass="myshad"
+            :canopen="true"
+          >
+            <q-select
+              v-model="actualcard"
+              :options="optionsMainCards"
+              emit-value
+              borderless
+              map-options
+              :behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
+            >
+              <template v-slot:option="scope">
+                <q-item v-bind="scope.itemProps">
+                  <q-item-section avatar>
+                    <q-icon :name="scope.opt.icon" />
+                  </q-item-section>
+                  <q-item-section>
+                    <q-item-label>{{ scope.opt.label }}</q-item-label>
+                    <!--<q-item-label caption>{{
+                        scope.opt.description
+                      }}</q-item-label>-->
+                  </q-item-section>
+                </q-item>
+              </template>
+            </q-select>
+
+            <q-tab-panels v-model="actualcard" animated>
+              <q-tab-panel
+                v-for="(card, ind) of mycards"
+                :key="ind"
+                :name="card.table"
+              >
+                <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">
+                      </CMyGroup>
+                    </span>
+                  </q-list>
+                </div>
+                <div v-else-if="card.table === 'circuits'">
+                  <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"
+                      >
+                      </CMyCircuit>
+                    </span>
+                  </q-list>
+                </div>
+                <div v-else>
+                  <CSkill
+                    v-if="card.table === actualcard"
+                    :table="card.table"
+                    :filtercustom="filtroutente"
+                    :butt_modif_new="isMyRecord(myuser.username)"
+                  />
+                </div>
+              </q-tab-panel>
+            </q-tab-panels>
+          </CTitleBanner>
+        </div>
+      </div>
+
+      <q-dialog v-model="showPic" full-height full-width>
+        <img :src="getImgUser()" :alt="username" class="full-width" />
+      </q-dialog>
+
+      <div v-if="showsendCoinTo">
+        <CSendCoins
+          :showprop="showsendCoinTo"
+          :to_user="myuser"
+          @close="showsendCoinTo = false"
+        >
+        </CSendCoins>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" src="./myactivities.ts">
+</script>
+
+<style lang="scss" scoped>
+@import './myactivities.scss';
+</style>
+

src/views/user/mycircuit/mycircuit.vue

@@ -1,5 +1,6 @@
 <template>
   <CNotifAtTop/>
+  circuit: {{circuit}}
   <div class="q-gutter-sm q-pa-sm q-pb-md">
     <div v-if="!circuit && !loading">
       <div v-if="mystatus === 403">

src/views/user/myprofile/myprofile.ts

@@ -196,6 +196,7 @@ export default defineComponent({
       idnotif,
       showsendCoinTo,
       site,
+      listcircuitsfiltered,
     }
   }
 })

src/views/user/myprofile/myprofile.vue

@@ -153,6 +153,17 @@
                 :href="getLinkUserTelegram()" target="__blank">
               </q-btn>
 
+            </div>
+            <div class="col-md-6 col-sm-6 q-ma-xs col-xs-12">
+              <q-btn
+                icon="fas fa-house-user"
+                size="md"
+                color="red"
+                :label="$t('profile.myactivities')"
+                :to="`/skills/` + myusername()"
+                >
+              </q-btn>
+
             </div>
             <div class="col-md-6 col-sm-6 q-ma-xs col-xs-12">
               <q-btn
@@ -194,58 +205,6 @@
         </div>
 
 
-        <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="actualcard" class="text-blue">
-            <q-tab v-for="(card, ind) of mycards" :key="ind" :name="card.table" :label="card.title">
-
-            </q-tab>
-          </q-tabs>
-
-          <q-tab-panels v-model="actualcard" animated>
-            <q-tab-panel v-for="(card, ind) of mycards" :key="ind" :name="card.table">
-
-              <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"
-                    >
-                    </CMyGroup>
-                  </span>
-                </q-list>
-
-              </div>
-              <div v-else-if="card.table === 'circuits'">
-                <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"
-                    >
-                    </CMyCircuit>
-                  </span>
-                </q-list>
-
-              </div>
-              <div v-else>
-                <CSkill
-                  v-if="card.table === actualcard"
-                  :table="card.table"
-                  :filtercustom="filtroutente"
-                  :butt_modif_new="isMyRecord(myuser.username)"
-                />
-              </div>
-
-            </q-tab-panel>
-          </q-tab-panels>
-
-        </CTitleBanner>
-
 
         <div v-if="myuser && myuser._id && (userStore.IsMyFriendByUsername(myuser.username) || isMyRecord(myuser.username))">
           <CTitleBanner