From ef36cd5e1100ec0090b3d6a6626ce5f4c295f14e Mon Sep 17 00:00:00 2001
From: Surya Paolo <paolo.arena77@gmail.com>
Date: Thu, 8 May 2025 11:06:01 +0200
Subject: [PATCH] - aggiornamento lista catalogo, ordinamento tabelle

---
 src/components/CProductTable/CProductTable.ts | 78 ++++++++++++---
 .../CProductTable/CProductTable.vue           | 98 ++++++++++---------
 src/store/Modules/tools.ts                    | 11 +++
 src/views/ecommerce/catalogo/catalogo.ts      |  8 +-
 src/views/ecommerce/catalogo/catalogo.vue     | 50 +++++++---
 5 files changed, 165 insertions(+), 80 deletions(-)

diff --git a/src/components/CProductTable/CProductTable.ts b/src/components/CProductTable/CProductTable.ts
index 44544176..61554883 100755
--- a/src/components/CProductTable/CProductTable.ts
+++ b/src/components/CProductTable/CProductTable.ts
@@ -106,6 +106,19 @@ export default defineComponent({
         selectedColumns.value = savedColumns;
       }
 
+      const savedSortAttribute = tools.getCookie("sortAttr");
+      if (savedSortAttribute) {
+        if (isColumnVisible(savedSortAttribute)) {
+          sortAttribute.value = savedSortAttribute;
+
+          const savedSortDir = tools.getCookie("sortDir");
+          if (savedSortDir) {
+            sortDirection.value = savedSortDir;
+          }
+
+        }
+      }
+
       loading.value = false
     }
 
@@ -119,11 +132,12 @@ export default defineComponent({
 
     // Colonne della tabella
     const allColumns = [
-      { name: "pos", label: "Ind", field: "pos", align: "left", style: "width: 50px" },
-      { name: "drag", label: "Ord", field: "", align: "left", style: "width: 50px", edit: true, noexp: true },
-      { name: "validato", label: "Val", field: "validato", align: "left", style: "" },
-      { name: "image", label: "Foto", field: "image", align: "center", noexp: true },
-      { name: "name", label: "Titolo del Libro", field: "name", align: "left" },
+      { name: "pos", label: "Ind", field: "pos", align: "left", style: "width: 50px", notsortable: true },
+      { name: "drag", label: "Ord", field: "", align: "left", style: "width: 50px", edit: true, noexp: true, notsortable: true },
+      { name: "validato", label: "Val", field: "validato", align: "left", style: "", },
+      { name: "image", label: "Foto", field: "image", align: "center", noexp: true, notsortable: true },
+      { name: "name", label: "Titolo", field: "name", align: "left" },
+      { name: "sottotitolo", label: "Sottotitolo", field: "sottotitolo", align: "left" },
       { name: "authors", label: "Autore", field: "authors", align: "left" },
       { name: "isbn", label: "ISBN", field: "isbn", align: "left" },
       { name: "trafiletto", label: "Sinossi", field: "trafiletto", align: "left" },
@@ -150,7 +164,7 @@ export default defineComponent({
       { name: "totFat", label: "Fat 5A", field: "totFat", align: "right", visu: costanti.VISUCAMPI.PER_EDITORE },
       { name: "ult_ord", label: "Ult. Ordine", field: "ult_ord", align: "left", visu: costanti.VISUCAMPI.PER_EDITORE },
       { name: "quantity", label: "Magazz.", field: "quantity", align: "right", visu: costanti.VISUCAMPI.PER_EDITORE },
-      { name: "actions", label: "Azioni", field: "", align: "center", visu: costanti.VISUCAMPI.PER_EDITORE, noexp: true },
+      { name: "actions", label: "Azioni", field: "", align: "center", visu: costanti.VISUCAMPI.PER_EDITORE, noexp: true, notsortable: true },
     ];
 
     function getFieldValue(element: any, field: any): any {
@@ -167,6 +181,9 @@ export default defineComponent({
           case 'name':
             return element.productInfo?.name;
 
+          case 'sottotitolo':
+            return element.productInfo?.sottotitolo;
+
           case 'authors':
             return formatAuthors(element.productInfo?.authors);
 
@@ -240,7 +257,10 @@ export default defineComponent({
             return tools.getstrDate(element.productInfo?.dataUltimoOrdine);
 
           case 'quantity':
-            return element.arrvariazioni?.[0]?.quantita;
+            if (tools.isUtente())
+              return tools.getDescrQuantitàByQuantity(element.arrvariazioni?.[0]?.quantita);
+            else
+              return element.arrvariazioni?.[0]?.quantita;
 
           default:
             return null;
@@ -351,12 +371,13 @@ export default defineComponent({
       }
     }
 
-
-
-
     let cookieValue: [] | null = null;
+
+    let keyvalue = 'selColCat_2'
+    if (tools.isUtente())
+      keyvalue += '_utente'
     try {
-      cookieValue = tools.getCookie("selColCat_2");
+      cookieValue = tools.getCookie(keyvalue);
       // Se il cookie esiste e contiene una stringa JSON valida
       cookieValue = cookieValue ? cookieValue : [];
     } catch (error) {
@@ -364,8 +385,19 @@ export default defineComponent({
       cookieValue = []; // In caso di errore, inizializza come array vuoto
     }
 
-    const selectedColumns = ref(cookieValue.length > 0 ? cookieValue : ["pos", "drag", "validato", "image", "name", "authors", "isbn", "catprods", "stato", "date_pub", "pagine", "trafiletto", "fatLast1Y", "quantity", "actions"]);
+    const selectedColumns_Editori = ref(cookieValue.length > 0 ? cookieValue : ["pos", "drag", "validato", "image", "name", "authors", "isbn", "catprods", "stato", "date_pub", "pagine", "trafiletto", "fatLast1Y", "quantity", "actions"]);
+    const selectedColumns_Utenti = ref(cookieValue.length > 0 ? cookieValue : ["pos", "image", "name", "authors", "isbn", "catprods", "stato", "date_pub", "pagine", "trafiletto", "quantity"]);
 
+    const selectedColumns = computed({
+      get: () => tools.isUtente() ? selectedColumns_Utenti.value : selectedColumns_Editori.value,
+      set: (value) => {
+        if (tools.isUtente()) {
+          selectedColumns_Utenti.value = value;
+        } else {
+          selectedColumns_Editori.value = value;
+        }
+      }
+    });
 
     // 3. Funzione per verificare se una colonna è visibile (isColumnVisible)
     const isColumnVisible = (column, real?: boolean) => {
@@ -402,6 +434,15 @@ export default defineComponent({
       saveSelectedColumns();
     });
 
+    watch(() => sortAttribute.value, (newVal) => {
+      tools.setCookie("sortAttr", newVal);
+    });
+
+    watch(() => sortDirection.value, (newVal) => {
+      tools.setCookie("sortDir", newVal);
+    });
+
+
     // Funzione chiamata alla fine del drag-and-drop
     const onDragEnd = () => {
       // console.log("Nuovo ordine:", internalProducts.value);
@@ -504,6 +545,11 @@ export default defineComponent({
           if (aVal instanceof Date && bVal instanceof Date) {
             return sortDirection.value === 1 ? aVal.getTime() - bVal.getTime() : bVal.getTime() - aVal.getTime();
           }
+          if (typeof aVal === 'string' && typeof bVal === 'string' && aVal.match(/^\d{1,2}\/\d{1,2}\/\d{4}$/) && bVal.match(/^\d{1,2}\/\d{1,2}\/\d{4}$/)) {
+            const aDate = new Date(aVal.split('/').reverse().join('-'));
+            const bDate = new Date(bVal.split('/').reverse().join('-'));
+            return sortDirection.value === 1 ? aDate.getTime() - bDate.getTime() : bDate.getTime() - aDate.getTime();
+          }
           if (typeof aVal === 'number' && typeof bVal === 'number') {
             return sortDirection.value === 1 ? aVal - bVal : bVal - aVal;
           }
@@ -529,13 +575,13 @@ export default defineComponent({
         case 'stato':
           return () => {
             // esempio: mostra dettagli dello stato
-            console.log('Stato prodotto:', element.productInfo?.idStatoProdotto);
+            // console.log('Stato prodotto:', element.productInfo?.idStatoProdotto);
           };
 
         case 'quantity':
           return () => {
             // esempio: mostra log disponibilità
-            console.log('Quantità disponibile:', element.arrvariazioni?.[0]?.quantita);
+            // console.log('Quantità disponibile:', element.arrvariazioni?.[0]?.quantita);
           };
 
         default:
@@ -574,6 +620,9 @@ export default defineComponent({
 
     }
 
+    function isSortable(field: string) : boolean {
+      return allColumns && !allColumns.find((col) => col.name === field)?.notsortable;
+    }
 
     onMounted(mounted)
 
@@ -615,6 +664,7 @@ export default defineComponent({
       getFieldClick,
       handleUpdate,
       exportToCSV,
+      isSortable,
     }
   }
 })
diff --git a/src/components/CProductTable/CProductTable.vue b/src/components/CProductTable/CProductTable.vue
index cf9dd552..25c7e585 100755
--- a/src/components/CProductTable/CProductTable.vue
+++ b/src/components/CProductTable/CProductTable.vue
@@ -1,39 +1,40 @@
 <template>
   <div>
     <!-- Selezione Colonne -->
-    <div class="q-mb-md">
-      <q-select
-        v-model="selectedColumns"
-        :options="allColumns"
-        label="Colonne da visualizzare"
-        multiple
-        filled
-        dense
-        class="float-right"
-        outlined
-        emit-value
-        map-options
-        option-value="name"
-        option-label="label"
-        style="max-width: 200px"
-      >
-        <template v-slot:prepend>
-          <q-icon name="settings" />
-        </template>
-      </q-select>
-      <q-btn
-        class="q-ml-md float-right"
-        flat
-        outline
-        color="primary"
-        icon="archive"
-        label="Esporta Lista"
-        @click="exportToCSV"
-      />
-    </div>
-
-    <div class="row justify-center q-mx-auto q-pt-sm text-italic">
-      {{ internalProducts?.length }} elementi nella lista
+    <div class="row justify-center">
+      <div class="row justify-center q-mx-auto q-pt-sm text-italic">
+        {{ internalProducts?.length }} elementi nella lista
+      </div>
+      <div class="q-mb-md text-right">
+        <q-select
+          v-model="selectedColumns"
+          :options="allColumns"
+          label="Colonne da visualizzare"
+          multiple
+          filled
+          dense
+          class="float-right"
+          outlined
+          emit-value
+          map-options
+          option-value="name"
+          option-label="label"
+          style="max-width: 200px"
+        >
+          <template v-slot:prepend>
+            <q-icon name="settings" />
+          </template>
+        </q-select>
+        <q-btn
+          class="q-ml-md float-right"
+          flat
+          outline
+          color="primary"
+          icon="archive"
+          label="Esporta Lista"
+          @click="exportToCSV"
+        />
+      </div>
     </div>
 
     <!-- Tabella Prodotti -->
@@ -45,21 +46,24 @@
             <th
               v-if="isColumnVisible(col.name)"
               :key="col.name"
-              @click="sortTable(col.name)"
+              @click="isSortable(col.name) ? sortTable(col.name) : ''"
+              :style="{ 'background-color': sortAttribute === col.name ? 'yellow' : '' }"
             >
-              {{ col.label }}
-              <q-icon
-                v-if="sortAttribute === col.name && optcatalogo.showListaArgomenti"
-                :name="sortDirection === 1 ? 'arrow_drop_up' : 'arrow_drop_down'"
-                size="16px"
-                class="q-ml-xs"
-              />
-              <q-icon
-                v-else-if="optcatalogo.showListaArgomenti"
-                name="arrow_drop_up"
-                size="16px"
-                class="q-ml-xs"
-              />
+              <span>{{ col.label }}</span>
+              <span v-if="isSortable(col.name)">
+                <q-icon
+                  v-if="sortAttribute === col.name && optcatalogo.showListaArgomenti"
+                  :name="sortDirection === 1 ? 'expand_less' : 'expand_more'"
+                  size="36px"
+                  class="q-ml-xs"
+                />
+                <q-icon
+                  v-else-if="optcatalogo.showListaArgomenti"
+                  :name="sortDirection === 1 ? 'expand_less' : 'expand_more'"
+                  size="24px"
+                  class="q-ml-xs"
+                />
+              </span>
             </th>
           </template>
         </tr>
diff --git a/src/store/Modules/tools.ts b/src/store/Modules/tools.ts
index 26d86330..588e70a8 100644
--- a/src/store/Modules/tools.ts
+++ b/src/store/Modules/tools.ts
@@ -9972,7 +9972,18 @@ export const tools = {
     }
   },
 
+  getDescrQuantitàByQuantity(quantity: number) : string {
+    if (quantity <= 1) {
+      return 'Non disponibile';
+    } else if (quantity > 1 && quantity <= 10) {
+      return 'Quasi terminato';
+    } else if (quantity > 10 && quantity <= 50) {
+      return 'In esaurimento';
+    } else {
+      return 'Buona';
+    }
 
+  },
 
   // FINE !
 
diff --git a/src/views/ecommerce/catalogo/catalogo.ts b/src/views/ecommerce/catalogo/catalogo.ts
index 22fdc1ad..5c11c335 100755
--- a/src/views/ecommerce/catalogo/catalogo.ts
+++ b/src/views/ecommerce/catalogo/catalogo.ts
@@ -787,7 +787,7 @@ export default defineComponent({
 
       if (generalista) {
         const catalog = getCatalogoByMyPage.value
-        if (catalog) {
+        if (catalog && !optcatalogo.value.showListaArgomenti) {
           catalog.data_lista_generata = tools.getDateNow()
           catalog.username_lista_generata = userStore.my.username
           await saveCatalog()
@@ -1213,9 +1213,9 @@ export default defineComponent({
         cat.value = tools.getCookie(getKeyCatAtLoad(), '')
 
       if (getCatalogoByMyPage.value) {
-        tabcatalogo.value = tools.getCookie('TAB_CAT', 'visu')
+        tabcatalogo.value = tools.getCookie('TAB_CAT', 'lista')
       } else {
-        tabcatalogo.value = 'visu'
+        tabcatalogo.value = 'lista'
       }
 
       optrigenera.value.visibilitaDisp = tools.getCookie((showListaArgomenti.value ? 'INC_ES_' : '') + 'VIS_DISP', costanti.DISP.DISPONIBILI)
@@ -1273,7 +1273,7 @@ export default defineComponent({
     });
 
     function getCatProds() {
-      return [{ label: 'Tutti', value: '', icon: undefined, color: undefined }].concat(
+      return [{ label: '[Seleziona un Argomento]', value: '', icon: undefined, color: undefined }].concat(
         productStore.getCatProds(cosa.value).map(rec => ({
           label: `${rec.name} (${productStore.getTotaliProdottiByIdCatProd(rec._id)})`,
           value: rec._id,
diff --git a/src/views/ecommerce/catalogo/catalogo.vue b/src/views/ecommerce/catalogo/catalogo.vue
index 503730b4..93a3a8c8 100755
--- a/src/views/ecommerce/catalogo/catalogo.vue
+++ b/src/views/ecommerce/catalogo/catalogo.vue
@@ -16,7 +16,6 @@
         {{ $t('cataloglist.referenti') }}: <span class="text-bold">{{ getReferentiCatalogo() }}</span>
       </div>
       <q-tabs
-        v-if="optcatalogo.pdf && (tools.isEditor() || tools.isCommerciale())"
         v-model="tabcatalogo"
         dense
         class="bg-green text-white"
@@ -39,7 +38,7 @@
         </q-tab>
         <q-tab
           name="visu"
-          icon="fas fa-eye"
+          icon="fas fa-book"
           label="Catalogo"
         >
         </q-tab>
@@ -58,6 +57,7 @@
         >
         </q-tab>
         <q-tab
+          v-if="!tools.isUtente()"
           name="tutorial"
           icon="fas fa-info"
           label="Tutorial"
@@ -119,12 +119,22 @@
               v-if="!generatinglist"
               class="text-center q-py-sm prod_trov"
             >
-              <span v-show="productStore.getNumProdTot() !== arrProducts.length">{{
-                t('ecomm.prodotti_trovati', {
-                  qta: arrProducts.length,
-                  qtatot: productStore.getNumProdTot(),
-                })
-              }}</span>
+              <div
+                v-if="cat === '' && arrProducts.length === 0 && showListaArgomenti"
+                class="row justify-center text-h6"
+              >
+                Seleziona un Argomento
+              </div>
+              <span
+                v-else
+                v-show="productStore.getNumProdTot() !== arrProducts.length"
+                >{{
+                  t('ecomm.prodotti_trovati', {
+                    qta: arrProducts.length,
+                    qtatot: productStore.getNumProdTot(),
+                  })
+                }}</span
+              >
             </div>
           </q-tab-panel>
 
@@ -200,7 +210,7 @@
           </div>
 
           <CProductTable
-            v-if="loadpage"
+            v-if="loadpage && lista_prodotti?.length > 0"
             :lista_prodotti="lista_prodotti"
             @update:lista_prodotti="updateProducts"
             :optcatalogo="optcatalogo"
@@ -453,12 +463,22 @@
                 </div>
 
                 <div class="text-center q-py-sm prod_trov">
-                  <span v-show="productStore.getNumProdTot() !== arrProducts.length">{{
-                    t('ecomm.prodotti_trovati', {
-                      qta: arrProducts.length,
-                      qtatot: productStore.getNumProdTot(),
-                    })
-                  }}</span>
+                  <div
+                    v-if="cat === '' && arrProducts.length === 0 && showListaArgomenti"
+                    class="row justify-center text-h6"
+                  >
+                    Seleziona un Argomento
+                  </div>
+                  <span
+                    v-else
+                    v-show="productStore.getNumProdTot() !== arrProducts.length"
+                    >{{
+                      t('ecomm.prodotti_trovati', {
+                        qta: arrProducts.length,
+                        qtatot: productStore.getNumProdTot(),
+                      })
+                    }}</span
+                  >
                 </div>
                 <div
                   class="row justify-around"