- Aggiornate tutte le categorie ottimizzandole.

- Migrazione delle vecchie categ. con quelle nuove.
- Create le Categorie e sottocategorie degli Eventi (a parte).
- Aggiornato la card dell'Ospitalità

src/components/CMyRecCard/CMyRecCard.vue

@@ -121,7 +121,6 @@
           />
         </q-avatar>
       </q-item-section>
-
       <q-item-section
         v-else-if="!myrec.organisedBy && table !== shared_consts.TABLES_MYBACHECAS"
         avatar
@@ -155,20 +154,21 @@
         <q-item-label class="tags-row">
           <div class="category-hierarchy">
             <q-chip
-              v-for="(rec, ind) of arrSector"
+              v-for="(recSect, ind) of arrSector"
               :key="'sec-' + ind"
               class="tag-chip sector"
               :style="{
-                background: `linear-gradient(135deg, ${rec.color}, ${rec.color})`,
+                background: `linear-gradient(135deg, ${recSect.color}, ${recSect.color})`,
               }"
+              :color="recSect.color"
             >
               <q-icon
-                v-if="rec.icon"
-                :name="rec.icon"
+                v-if="recSect.icon"
+                :name="recSect.icon"
                 size="xs"
                 class="q-mr-xs"
               />
-              {{ rec.descr }}
+              {{ recSect.descr }}
             </q-chip>
             <q-icon
               v-if="arrSubSector.length > 0"
@@ -181,9 +181,10 @@
               :key="'sub-' + ind"
               class="tag-chip subsector"
               :style="{
-                background: `linear-gradient(135deg, ${rec.color}, ${rec.color})`,
+                background: `linear-gradient(135deg, ${getColorSubSector}, ${getColorSubSector})`,
                 opacity: 0.8,
               }"
+              :color="getColorSubSector"
             >
               <q-icon
                 v-if="rec.icon"
@@ -194,23 +195,25 @@
               {{ rec.descr }}
             </q-chip>
           </div>
-          <template v-for="(recstatus, index) in myrec.idStatusSkill">
-            <q-badge
-              v-if="
-                recstatus === shared_consts.STATUSSKILL_ONLINE ||
-                myrec.idStatusSkill?.length > 1
-              "
-              :key="'stat-' + index"
-              :color="globalStore.getColByStatusSkills(recstatus)"
-              class="status-badge"
-            >
-              <q-icon
-                :name="globalStore.getStatusSkillIconById(recstatus)"
-                size="14px"
-              />
-              {{ globalStore.getStatusSkillById(recstatus) }}
-            </q-badge>
-          </template>
+          <div class="status-row">
+            <div v-for="(recstatus, index) in myrec.idStatusSkill">
+              <q-badge
+                v-if="
+                  recstatus === shared_consts.STATUSSKILL_ONLINE ||
+                  myrec.idStatusSkill?.length > 1
+                "
+                :key="'stat-' + index"
+                :color="globalStore.getColByStatusSkills(recstatus)"
+                class="status-badge"
+              >
+                <q-icon
+                  :name="globalStore.getStatusSkillIconById(recstatus)"
+                  size="14px"
+                />
+                {{ globalStore.getStatusSkillById(recstatus) }}
+              </q-badge>
+            </div>
+          </div>
         </q-item-label>
 
         <!-- Descrizione -->
@@ -225,6 +228,30 @@
           {{ myrec.descr }}
         </q-item-label>
 
+        <!-- Preferences (solo per MYHOSPS) -->
+        <q-item-label
+          v-if="table === shared_consts.TABLES_MYHOSPS && myrec.preferences && myrec.preferences.length > 0"
+          class="preferences-row"
+        >
+          <div class="preferences-icons-container">
+            <q-avatar
+              v-for="(prefId, ind) of myrec.preferences"
+              :key="ind"
+              size="32px"
+              :style="`background-color: ${tools.getPreferenceById(prefId)?.color || 'grey'}; cursor: pointer;`"
+              class="preference-icon-avatar"
+              @click.stop="showPreferencesDialog = true"
+            >
+              <q-icon
+                :name="tools.getPreferenceById(prefId)?.icon || 'help'"
+                size="18px"
+                color="white"
+              />
+              <q-tooltip>{{ tools.getPreferenceById(prefId)?.label }}</q-tooltip>
+            </q-avatar>
+          </div>
+        </q-item-label>
+
         <!-- Info Utente e Stats -->
         <q-item-label class="user-stats-row">
           <div class="user-name">
@@ -364,6 +391,49 @@
     </q-item>
     <q-separator />
   </div>
+  <!-- Categories Dialog -->
+  <q-dialog v-model="showPreferencesDialog">
+    <q-card
+      class="categories-dialog"
+      :style="{ minWidth: $q.screen.lt.sm ? '90vw' : '400px' }"
+    >
+      <q-card-section class="dialog-header">
+        <div class="text-h6">Categorie</div>
+      </q-card-section>
+
+      <q-separator />
+
+      <q-card-section class="dialog-content">
+        <div class="categories-grid">
+
+          <q-chip
+            v-for="(rec, ind) of myrec.preferences"
+            :key="ind"
+            class="category-chip shadow-3"
+            :style="`background-color: ${tools.getPreferenceById(rec).color}; color: white;`"
+          >
+            <q-icon
+              :name="tools.getPreferenceById(rec).icon"
+              left
+              size="18px"
+            />
+            {{ tools.getPreferenceById(rec).label }}
+          </q-chip>
+        </div>
+      </q-card-section>
+
+      <q-separator />
+
+      <q-card-actions align="right">
+        <q-btn
+          flat
+          label="Chiudi"
+          color="primary"
+          v-close-popup
+        />
+      </q-card-actions>
+    </q-card>
+  </q-dialog>
 </template>
 
 <script lang="ts" src="./CMyRecCard.ts"></script>