La foto non si carica bene sul server.

L'immagine della Bacheca metterla in fondo.
Creare un'area LAVORO ed un'area BACHECA.
Poter contattare la persona dalla pagina che si apre.
Riscritto visualizzazione della Card Competenza

src/components/CMyRecCard/CMyRecCard.scss

@@ -0,0 +1,4 @@
+.myflex{
+  display: flex;
+  flex: 1;
+}

src/components/CMyRecCard/CMyRecCard.ts

@@ -0,0 +1,84 @@
+import { defineComponent, onMounted, PropType, ref, watch } from 'vue'
+import { useUserStore } from '@store/UserStore'
+import { IImgGallery, IUserFields, IUserProfile } from 'model'
+import { costanti } from '@costanti'
+import { shared_consts } from '@/common/shared_vuejs'
+import { fieldsTable } from '@store/Modules/fieldsTable'
+import { tools } from '@store/Modules/tools'
+import { useQuasar } from 'quasar'
+import { useI18n } from '@/boot/i18n'
+import { CMyCardPopup } from '@/components/CMyCardPopup'
+// import { useRouter } from 'vue-router'
+
+export default defineComponent({
+  name: 'CMyRecCard',
+  components: { CMyCardPopup },
+  emits: ['setCmd', 'cmdext'],
+  props: {
+    table: {
+      type: String,
+      required: true,
+    },
+    prop_myrec: {
+      type: Object as PropType<any | null>,
+      required: false,
+      default: null,
+    },
+  },
+
+  setup(props, { emit }) {
+
+    const userStore = useUserStore()
+    // const $q = useQuasar()
+    const { t } = useI18n()
+    // const $router = useRouter()
+
+    const myrec = ref(<any | null>null)
+
+    const visupage = ref(false)
+
+    watch(() => props.prop_myrec, (newval, oldval) => {
+
+      mounted()
+    })
+
+    function mounted() {
+      if (props.prop_myrec) {
+        myrec.value = props.prop_myrec
+      }
+    }
+
+    function getImgUser(profile: IUserFields) {
+      return userStore.getImgByProfile(profile)
+    }
+
+    /*function naviga(path: string) {
+      $router.push(path)
+    }*/
+
+    function setCmd($q: any, cmd: number, myusername: string, value: any, groupname: string) {
+      emit('setCmd', $q, cmd, myusername, value, groupname)
+    }
+
+    function cmdExt(cmd: any, val1: any, val2: any) {
+      emit('cmdext', cmd, val1, val2)
+    }
+
+    onMounted(mounted)
+
+    return {
+      t,
+      myrec,
+      costanti,
+      getImgUser,
+      // naviga,
+      setCmd,
+      shared_consts,
+      userStore,
+      tools,
+      fieldsTable,
+      cmdExt,
+      visupage,
+    }
+  },
+})

src/components/CMyRecCard/CMyRecCard.vue

@@ -0,0 +1,65 @@
+<template>
+  <div class="q-py-xs centermydiv" :style="`min-width: `+ (tools.getwidth($q) - 20) +`px;`">
+    <q-item v-if="myrec" clickable v-ripple class="shadow-2 q-btn--rounded bg-teal-1">
+      <q-item-section avatar @click="naviga(`/my/` + myrec.username)">
+        <q-badge class="q-my-xs self-center" :color="fieldsTable.getColByAdType(myrec.adType)">
+          {{ fieldsTable.getValByTabAndId(table, 'adType', myrec.adType) }}
+          <q-icon :name="fieldsTable.getIconByAdType(myrec.adType)" color="white"
+                  class="q-ml-xs"/>
+        </q-badge>
+        <q-avatar size="60px">
+          <q-img :src="getImgUser(myrec)" :alt="myrec.username" img-class="imgprofile" height="60px"/>
+        </q-avatar>
+      </q-item-section>
+
+      <q-item-section @click="cmdExt(costanti.CMD_SHOW_PAGE, myrec)">
+        <q-item-label class="full-width">
+          <span v-for="(rec, ind) of myrec.recSkill" :key="ind"> <q-chip
+            dense
+            class="text-center shadow-5 glossy bg-blue chipmodif">{{ rec.descr }}</q-chip></span>
+          <span v-for="(rec, ind) of myrec.myskill" :key="ind"> <q-chip
+            dense
+            class="text-center shadow-5 glossy bg-green chipmodif">{{ rec.descr }}</q-chip></span>
+
+          <!--<span> - {{ myrec.profile.qualifica }}</span>-->
+        </q-item-label>
+        <q-item-label lines="3" v-if="myrec.descr">{{ myrec.descr }}<br>
+        </q-item-label>
+        <q-item-label overline lines="1" style="text-align: right">
+          <span class="text-weight-bold">{{ myrec.username }}</span> -
+          <span v-for="(rec, ind) of myrec.mycities" :key="ind"><span v-if="ind > 0">, </span>{{ rec.comune }}</span>
+        </q-item-label>
+
+      </q-item-section>
+      <q-item-section side v-if="myrec.userId === userStore.my._id">
+        <q-item-label>
+          <q-btn rounded icon="fas fa-ellipsis-h">
+            <q-menu>
+              <q-list style="min-width: 150px">
+                <q-item clickable icon="fas fa-pencil-alt" v-close-popup
+                        @click="cmdExt(costanti.CMD_MODIFY, myrec._id)">
+                  <q-item-section>{{ $t('reg.edit') }}</q-item-section>
+                </q-item>
+              </q-list>
+              <q-list style="min-width: 150px">
+                <q-item clickable icon="fas fa-trash-alt" v-close-popup @click="cmdExt(costanti.CMD_DELETE, myrec._id)">
+                  <q-item-section>{{ $t('reg.elimina') }}</q-item-section>
+                </q-item>
+              </q-list>
+            </q-menu>
+          </q-btn>
+        </q-item-label>
+      </q-item-section>
+
+    </q-item>
+    <q-separator inset="item"/>
+  </div>
+
+</template>
+
+<script lang="ts" src="./CMyRecCard.ts">
+</script>
+
+<style lang="scss" scoped>
+@import './CMyRecCard.scss';
+</style>

src/components/CMyRecCard/index.ts

@@ -0,0 +1 @@
+export { default as CMyRecCard } from './CMyRecCard.vue'