surya/myprojplanet_vite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Surya Paolo
2025-07-10 00:43:28 +02:00
parent be0d7efca2
commit 2ce8a72286
16 changed files with 375 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
src/components/CProductTable/CProductTable.ts
View File

@@ -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,
};
},
});

87
src/components/CProductTable/CProductTable.vue
View File

@@ -15,12 +15,11 @@
placeholder="Cerca titolo se presente in lista"
class="col-12 col-md-6"
:style="{ 'min-width': '300px' }"
>
</q-input>
<div
v-if="searchText"
class="row justify-center q-mx-auto q-pa-sm text-caption text-red-7 "
class="row justify-center q-mx-auto q-pa-sm text-caption text-red-7"
>
Lista filtrata con il termine "{{ searchText }}"
</div>
@@ -45,14 +44,81 @@
<q-icon name="settings" />
</template>
</q-select>
<q-dialog
v-model="showDialogExport"
>
<q-card style="min-width: 400px">
<q-card-section>
<div class="text-h6">Esporta {{ title }}</div>
</q-card-section>
<q-card-section class="q-pt-none">
<q-markup-table
separator="cell"
flat
bordered
>
<thead>
<tr>
<th
class="text-left"
style="width: 30px"
>
Sel
</th>
<th class="text-left">Colonna</th>
</tr>
</thead>
<tbody>
<tr
v-for="(col, idx) in allColumnsToExported"
:key="idx"
>
<td class="text-left">
<q-checkbox
v-model="selectedExportColumns"
:val="col.name"
/>
</td>
<td class="text-left">{{ col.label }}</td>
</tr>
</tbody>
</q-markup-table>
</q-card-section>
<q-card-actions
align="right"
class="text-primary"
>
<q-btn
flat
label="Annulla"
v-close-popup
/>
<q-btn
@click="exportToXLSAfterCSV(title, selectedExportColumns)"
color="primary"
icon="fas fa-file-excel"
label="Esporta in Excel"
flat
v-close-popup
/>
<q-btn
@click="exportToCSV(title, selectedExportColumns)"
color="primary"
icon="fas fa-file-csv"
label="Esporta in CSV"
flat
v-close-popup
/>
</q-card-actions>
</q-card>
</q-dialog>
<q-btn
class="q-ml-md float-right"
flat
outline
color="primary"
color="positive"
icon="archive"
label="Esporta Lista"
@click="exportToCSV"
label="Esporta"
flat
dense
@click="showDialogExport = true"
/>
</div>
</div>
@@ -149,7 +215,7 @@
/>
</span>
</td>
<td v-else-if="field.name === 'addtocart' && isColumnVisible('addtocart') ">
<td v-else-if="field.name === 'addtocart' && isColumnVisible('addtocart')">
<q-btn
icon-right="fas fa-cart-plus"
color="positive"
@@ -183,7 +249,8 @@
<td
v-else-if="
field.name === 'addtolist' &&
isColumnVisible('addtolist') && isElementVisible('addtolist', element)
isColumnVisible('addtolist') &&
isElementVisible('addtolist', element)
"
>
<q-btn