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/CMyCardPopup/CMyCardPopup.scss

@@ -0,0 +1,34 @@
+.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;
+}
+
+
+.text-bacheca{
+  margin: 10px;
+  border: solid 2px #4198ef;
+  border-radius: 1rem;
+  padding: 10px;
+
+}
+
+.note-bacheca{
+  border: solid 2px #C10015;
+  border-radius: 1rem;
+  padding: 10px;
+
+}

src/components/CMyCardPopup/CMyCardPopup.ts

@@ -0,0 +1,95 @@
+import { computed, defineComponent, onMounted, PropType, ref, watch } from 'vue'
+
+import { CMyFieldDb } from '@/components/CMyFieldDb'
+import { CTitleBanner } from '@/components/CTitleBanner'
+import { CProfile } from '@/components/CProfile'
+import { CDateTime } from '@/components/CDateTime'
+import { CMyPage } from '@/components/CMyPage'
+import { CMyFieldRec } from '@/components/CMyFieldRec'
+import { tools } from '@store/Modules/tools'
+import { useUserStore } from '@store/UserStore'
+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 { IColGridTable, IMyBacheca, IUserFields } from 'model'
+import { shared_consts } from '@/common/shared_vuejs'
+import { colCitys, fieldsTable } from '@store/Modules/fieldsTable'
+
+export default defineComponent({
+  name: 'CMyCardPopup',
+  components: { CProfile, CTitleBanner, CMyFieldDb, CDateTime, CMyPage, CMyFieldRec },
+  props: {
+    table: {
+      type: String,
+      required: true,
+    },
+    prop_myrec: {
+      type: Object as PropType<any>,
+      required: false,
+      default: null,
+    },
+    idRec: {
+      type: Number,
+      required: false,
+      default: 0
+    }
+  },
+  setup(props) {
+
+    const userStore = useUserStore()
+    const globalStore = useGlobalStore()
+    const $q = useQuasar()
+    const { t } = useI18n()
+
+    const showPic = ref(false)
+
+    const mybacheca = ref(<IMyBacheca>{})
+    const col = ref(<IColGridTable>{})
+
+    function profile() {
+      return userStore.my.profile
+    }
+
+    function load() {
+      // Carica il profilo di quest'utente
+      if (props.idRec > 0) {
+        userStore.loadGeneric(props.table, props.idRec).then((ris) => {
+          mybacheca.value = ris
+        })
+
+      } else {
+        mybacheca.value = props.prop_myrec
+      }
+
+      col.value = fieldsTable.getArrColsByTable(props.table)
+    }
+
+    watch(() => props.idRec, (to: any, from: any) => {
+      load()
+    })
+
+    function mounted() {
+      load()
+    }
+
+    onMounted(mounted)
+
+    return {
+      profile,
+      tools,
+      costanti,
+      mybacheca,
+      shared_consts,
+      globalStore,
+      showPic,
+      userStore,
+      t,
+      fieldsTable,
+      colCitys,
+      toolsext,
+      col,
+    }
+  }
+})

src/components/CMyCardPopup/CMyCardPopup.vue

@@ -0,0 +1,59 @@
+<template>
+  <q-card class="dialog_card" v-if="mybacheca">
+    <q-bar dense class="bg-primary text-white">
+      {{ mybacheca.username }}
+      <q-space/>
+      <q-btn flat round color="white" icon="close" v-close-popup></q-btn>
+    </q-bar>
+    <q-card-section class="inset-shadow">
+
+      <div class="text-center">
+        <q-chip :icon="fieldsTable.getIconByAdType(mybacheca.adType)"
+                :color="fieldsTable.getColByAdType(mybacheca.adType)"
+                text-color="white">{{
+            fieldsTable.getValByTabAndId(table, 'adType', mybacheca.adType)
+          }}
+        </q-chip>
+      </div>
+
+      <!--:title="t(mycol.label_trans)"-->
+
+      <div v-for="(mycol, index) of col" :key="index">
+        <div
+          v-if="(mycol.visible && (tools.checkIfShowField(mycol, tools.TIPOVIS_SHOW_RECORD, false, tools.getValue(mybacheca, mycol.field, mycol.subfield))))">
+          <div v-if="mycol.fieldtype === costanti.FieldType.html">
+            <div class="note-bacheca"
+                 v-html="tools.getValue(mybacheca, mycol.field, mycol.subfield)">
+
+            </div>
+          </div>
+          <div v-else-if="mycol.name === 'descr'">
+            <div class="text-bacheca">
+              {{ tools.getValue(mybacheca, mycol.field, mycol.subfield) }}
+            </div>
+          </div>
+          <CMyFieldRec
+            v-else
+            :table="table"
+            :id="mybacheca._id"
+            :rec="mybacheca"
+            :field="mycol.field"
+            :canEdit="false"
+            :canModify="false">
+          </CMyFieldRec>
+        </div>
+      </div>
+
+
+    </q-card-section>
+
+  </q-card>
+</template>
+
+<script lang="ts" src="./CMyCardPopup.ts">
+</script>
+
+<style lang="scss" scoped>
+@import './CMyCardPopup.scss';
+</style>
+

src/components/CMyCardPopup/index.ts

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