. esportazione lista catalogo direttamente in EXCEL, e scelta dei campi.

src/components/CProductTable/CProductTable.ts

@@ -33,6 +33,8 @@ import { CViewTable } from '../CViewTable';
 import { CLabel } from '../CLabel';
 import { useI18n } from 'vue-i18n';
 
+import * as XLSX from 'xlsx';
+
 export default defineComponent({
   name: 'CProductTable',
   emits: ['update:lista_prodotti', 'update:optcatalogo', 'rigenera', 'addtolist'],
@@ -80,6 +82,11 @@ export default defineComponent({
       required: false,
       default: () => ({}),
     },
+    title: {
+      type: String,
+      required: false,
+      default: 'Lista',
+    },
   },
   setup(props, { emit }) {
     // Copia locale della lista_prodotti per manipolazione interna
@@ -93,6 +100,8 @@ export default defineComponent({
 
     const searchText = ref('');
 
+    const fabexp = ref('');
+
     const arrordersCart = ref(<IOrderCart[]>[]);
 
     const globalStore = useGlobalStore();
@@ -118,6 +127,9 @@ export default defineComponent({
 
     const addstr = ref('');
 
+    const showDialogExport = ref(false);
+    const selectedExportColumns = ref([]);
+
     const optionscatalogo = ref(<any>{ maxlength: 0 });
 
     function handleUpdate(newList) {
@@ -320,6 +332,7 @@ export default defineComponent({
         field: 'validato',
         align: 'left',
         style: '',
+        noexp: true,
         visu: costanti.VISUCAMPI.PER_EDITORE,
       },
       {
@@ -328,6 +341,7 @@ export default defineComponent({
         field: 'scraped',
         align: 'left',
         style: '',
+        noexp: true,
         visu: costanti.VISUCAMPI.PER_EDITORE,
       },
       {
@@ -336,6 +350,7 @@ export default defineComponent({
         field: 'scraped_error',
         align: 'left',
         style: '',
+        noexp: true,
         visu: costanti.VISUCAMPI.PER_EDITORE,
       },
       {
@@ -497,6 +512,10 @@ export default defineComponent({
       );
     });
 
+    const allColumnsToExported = computed(() => {
+      return allColumnsComputed.value.filter((col) => !col.noexp);
+    });
+
     async function mounted() {
       //myorder = ProductStore.createMyOrder()
       // ProductStore.initproduct(myorder);
@@ -532,6 +551,7 @@ export default defineComponent({
       };
 
       const savedColumns = tools.getCookie(addstr.value + 'selColCat_2');
+      selectedExportColumns.value = tools.getCookie(addstr.value + 'Exp_Columns');
       if (savedColumns) {
         selectedColumns.value = savedColumns;
       }
@@ -673,11 +693,11 @@ export default defineComponent({
 
             case 'prezzo':
               // return element.price ? '€ ' + element.price.toFixed(2) : '';
-              const add = colexport ? '' : '&nbsp;'
+              const add = colexport ? '' : '&nbsp;';
               return '€' + add + element.arrvariazioni?.[0]?.price?.toFixed(2);
 
             case 'prezzo_sconto':
-              const add2 = colexport ? '' : '&nbsp;'
+              const add2 = colexport ? '' : '&nbsp;';
               // return element.sale_price ? '€ ' + element.sale_price.toFixed(2) : '';
               return '€' + add2 + element.arrvariazioni?.[0]?.sale_price?.toFixed(2);
 
@@ -982,6 +1002,10 @@ export default defineComponent({
       );
     };
 
+    const saveSelectedColumnsExport = (column: string[]) => {
+      tools.setCookie(addstr.value + 'Exp_Columns', JSON.stringify(column));
+    };
+
     // 9. Watcher per salvare automaticamente le preferenze quando cambiano
     watch(
       () => selectedColumns.value,
@@ -1190,26 +1214,31 @@ export default defineComponent({
       }
     }
 
-    function exportToCSV() {
+    function exportToCSV(
+      title: string = 'lista_',
+      columns: any[],
+      separatore: string = '\t'
+    ) {
+      saveSelectedColumnsExport(columns);
       const csvContent = [
-        selectedColumns.value
-          .filter((col) => !allColumns.value.find((c) => c.name === col)?.noexp)
+        columns
+          .filter((col) => !columns.find((c) => c.name === col)?.noexp)
           .map((col) => getColumnLabelByName(col))
-          .join('|'),
+          .join(separatore),
         ...internalProducts.value.map((product: any) => {
-          return selectedColumns.value
-            .filter((col) => !allColumns.value.find((c) => c.name === col)?.noexp)
+          return columns
+            .filter((col) => !columns.find((c) => c.name === col)?.noexp)
             .map((col: string) => {
               const field = { field: col };
               return field.field === 'pos'
                 ? internalProducts.value.indexOf(product) + 1
                 : getFieldValue(product, field, true);
             })
-            .join('|');
+            .join(separatore);
         }),
       ].join('\r\n');
 
-      const filename = 'prodotti_' + new Date().toISOString().slice(0, 10) + '.csv';
+      const filename = title + new Date().toISOString().slice(0, 10) + '.csv';
       const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
       const link = document.createElement('a');
       const url = URL.createObjectURL(blob);
@@ -1223,6 +1252,60 @@ export default defineComponent({
       document.body.removeChild(link);
     }
 
+    function exportToXLSAfterCSV(
+      title: string = 'lista',
+      columns: any[],
+      separatore: string = '\t'
+    ) {
+      saveSelectedColumnsExport(columns);
+      const csvContent = [
+        columns
+          .filter((col) => !columns.find((c) => c.name === col)?.noexp)
+          .map((col) => getColumnLabelByName(col))
+          .join(separatore),
+        ...internalProducts.value.map((product: any) => {
+          return columns
+            .filter((col) => !columns.find((c) => c.name === col)?.noexp)
+            .map((col: string) => {
+              const field = { field: col };
+              return field.field === 'pos'
+                ? internalProducts.value.indexOf(product) + 1
+                : getFieldValue(product, field, true);
+            })
+            .join(separatore);
+        }),
+      ].join('\r\n');
+
+      // Creazione del file XLS dopo il CSV
+      exportToXLS(csvContent, title);
+    }
+
+    function exportToXLS(csvContent: string, title: string) {
+      // Usa SheetJS per creare il file XLS a partire dal CSV
+      const worksheet = XLSX.utils.aoa_to_sheet(
+        csvContent.split('\r\n').map((line) => line.split('\t'))
+      );
+
+      const workbook = XLSX.utils.book_new();
+      XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');
+
+      // Genera il file XLS
+      const xlsData = XLSX.write(workbook, { bookType: 'xls', type: 'array' });
+
+      // Crea il Blob correttamente con il tipo MIME
+      const xlsBlob = new Blob([xlsData], { type: 'application/vnd.ms-excel' });
+
+      // Crea un URL per il file XLS
+      const xlsFilename = `${title}${new Date().toISOString().slice(0, 10)}.xls`;
+      const xlsUrl = URL.createObjectURL(xlsBlob);
+
+      // Crea un link per scaricare il file
+      const link = document.createElement('a');
+      link.href = xlsUrl;
+      link.download = xlsFilename;
+      link.click();
+    }
+
     function isSortable(field: string): boolean {
       return (
         allColumns && !allColumns.value.find((col) => col.name === field)?.notsortable
@@ -1361,6 +1444,7 @@ export default defineComponent({
       getFieldClick,
       handleUpdate,
       exportToCSV,
+      exportToXLSAfterCSV,
       isSortable,
       getImageByElement,
       isVisibleEditBtn,
@@ -1373,6 +1457,10 @@ export default defineComponent({
       searchProducts,
       searchText,
       isElementVisible,
+      fabexp,
+      showDialogExport,
+      selectedExportColumns,
+      allColumnsToExported,
     };
   },
 });