301 lines
9.0 KiB
TypeScript
Executable File
301 lines
9.0 KiB
TypeScript
Executable File
import { PropType, computed, defineComponent, onMounted, ref, watch } from "vue";
|
|
import draggable from 'vuedraggable'
|
|
|
|
import { tools } from '@tools'
|
|
|
|
import { useGlobalStore } from '@src/store/globalStore'
|
|
|
|
import { CMyValueDb } from '@src/components/CMyValueDb'
|
|
import { CSearchProduct } from '@src/components/CSearchProduct'
|
|
import { CMyDialog } from '@src/components/CMyDialog'
|
|
|
|
import { costanti } from '@costanti'
|
|
import { IAuthor, ICatProd } from "app/src/model";
|
|
|
|
import type {
|
|
IMyScheda,
|
|
IOptCatalogo,
|
|
IProduct
|
|
} from '@src/model';
|
|
import { shared_consts } from "app/src/common/shared_vuejs";
|
|
import { useProducts } from "app/src/store/Products";
|
|
import { CViewTable } from "../CViewTable";
|
|
import { CLabel } from "../CLabel";
|
|
import { useI18n } from "vue-i18n";
|
|
|
|
|
|
export default defineComponent({
|
|
name: "CProductTable",
|
|
emits: ["update:lista_prodotti", "update:optcatalogo"],
|
|
components: {
|
|
draggable, CSearchProduct, CMyDialog, CMyValueDb, CViewTable, CLabel,
|
|
},
|
|
props: {
|
|
lista_prodotti: {
|
|
type: Array,
|
|
required: true,
|
|
},
|
|
optcatalogo: {
|
|
type: Object as PropType<IOptCatalogo>,
|
|
required: false,
|
|
default: null,
|
|
},
|
|
scheda: {
|
|
type: Object as PropType<IMyScheda>,
|
|
required: false,
|
|
default: () => ({
|
|
|
|
}),
|
|
},
|
|
},
|
|
setup(props, { emit }) {
|
|
// Copia locale della lista_prodotti per manipolazione interna
|
|
const internalProducts = ref([...props.lista_prodotti]);
|
|
|
|
const { t } = useI18n()
|
|
|
|
const globalStore = useGlobalStore()
|
|
const products = useProducts()
|
|
|
|
const showProd = ref(false)
|
|
const selProd = ref(<IProduct | null>null)
|
|
|
|
const cmd = ref(shared_consts.SCHEDA_PRODOTTO.CMD_NONE)
|
|
|
|
const showQtaDisponibile = ref(false)
|
|
const loading = ref(false)
|
|
const visufromgm = ref(false)
|
|
const updatefromgm = ref(false)
|
|
const field_updated_fromGM = ref('')
|
|
|
|
const modifOn = ref(false)
|
|
const endload = ref(false)
|
|
|
|
const optionscatalogo = ref(<any>{maxlength: 0})
|
|
|
|
const editOn = computed({
|
|
get(): boolean {
|
|
return globalStore.editOn ? globalStore.editOn : false
|
|
},
|
|
|
|
set(value: boolean) {
|
|
return tools.updateEditOn(value)
|
|
}
|
|
})
|
|
|
|
|
|
async function mounted() {
|
|
|
|
optionscatalogo.value = {
|
|
maxlength: props.scheda?.testo_bottom?.maxlength
|
|
}
|
|
}
|
|
|
|
// Aggiorna la copia locale quando il prop cambia
|
|
watch(
|
|
() => props.lista_prodotti,
|
|
(newVal) => {
|
|
internalProducts.value = [...newVal];
|
|
}
|
|
);
|
|
|
|
// Colonne della tabella
|
|
const allColumns = [
|
|
{ name: "drag", label: "Ordinam.", field: "", align: "left", style: "width: 50px" },
|
|
{ name: "image", label: "Foto", field: "image", align: "center" },
|
|
{ name: "name", label: "Titolo del Libro", field: "name", align: "left" },
|
|
{ name: "authors", label: "Autore", field: "authors", align: "left" },
|
|
{ name: "trafiletto", label: "Trafiletto", field: "trafiletto", align: "left" },
|
|
{ name: "catprods", label: "Argomento", field: "catprods", align: "left" },
|
|
{ name: "date_pub", label: "Pubblicato", field: "date_pub", align: "left" },
|
|
{ name: "ranking", label: "Class.", field: "ranking", align: "right" },
|
|
{ name: "rank3M", label: "Class. 3M", field: "rank3M", align: "right" },
|
|
{ name: "rank6M", label: "Class. 6M", field: "rank6M", align: "right" },
|
|
{ name: "rank1Y", label: "Class. 1Y", field: "rank1Y", align: "right" },
|
|
{ name: "pagine", label: "Pag.", field: "pagine", align: "right" },
|
|
{ name: "totVen", label: "Venduti", field: "totVen", align: "right" },
|
|
{ name: "totFat", label: "Fattur.", field: "totFat", align: "right" },
|
|
{ name: "ult_ord", label: "Ult. Ordine", field: "ult_ord", align: "left" },
|
|
{ name: "quantity", label: "Magazz.", field: "quantity", align: "right" },
|
|
{ name: "isbn", label: "ISBN", field: "isbn", align: "left" },
|
|
{ name: "actions", label: "Azioni", field: "", align: "center" },
|
|
];
|
|
|
|
let cookieValue: [] | null = null;
|
|
try {
|
|
cookieValue = tools.getCookie("selColCat");
|
|
// Se il cookie esiste e contiene una stringa JSON valida
|
|
cookieValue = cookieValue ? cookieValue : [];
|
|
} catch (error) {
|
|
console.error("Errore durante la lettura del cookie 'selColCat'", error);
|
|
cookieValue = []; // In caso di errore, inizializza come array vuoto
|
|
}
|
|
|
|
const selectedColumns = ref(cookieValue.length > 0 ? cookieValue : ["drag", "image", "name", "authors", "catprods", "isbn", "actions"]);
|
|
|
|
|
|
// 3. Funzione per verificare se una colonna è visibile (isColumnVisible)
|
|
const isColumnVisible = (column) => {
|
|
return selectedColumns.value.includes(column);
|
|
}
|
|
|
|
// Funzione per eliminare un prodotto
|
|
const removeProduct = (product) => {
|
|
internalProducts.value = internalProducts.value.filter((p: any) => p._id !== product._id);
|
|
emit("update:lista_prodotti", internalProducts.value); // Notifica il parent del cambiamento
|
|
}
|
|
|
|
// 8. Salvataggio delle colonne selezionate in un cookie
|
|
const saveSelectedColumns = () => {
|
|
tools.setCookie("selColCat", JSON.stringify(selectedColumns.value));
|
|
};
|
|
|
|
// 9. Watcher per salvare automaticamente le preferenze quando cambiano
|
|
watch(() => selectedColumns.value, () => {
|
|
saveSelectedColumns();
|
|
});
|
|
|
|
// Funzione chiamata alla fine del drag-and-drop
|
|
const onDragEnd = () => {
|
|
// console.log("Nuovo ordine:", internalProducts.value);
|
|
emit("update:lista_prodotti", internalProducts.value); // Notifica il parent del cambiamento
|
|
}
|
|
|
|
function formatAuthors(authors: IAuthor[] | undefined | null): string {
|
|
if (!authors || !Array.isArray(authors)) {
|
|
return ""; // Restituisci una stringa vuota se authors non è un array valido
|
|
}
|
|
|
|
// Estrai il nome e il cognome di ogni autore e uniscili con ', '
|
|
return authors
|
|
.map((author) => `${author.name ?? ""} ${author.surname ?? ""}`.trim())
|
|
.filter((name) => name.length > 0) // Filtra eventuali nomi vuoti
|
|
.join(", ");
|
|
}
|
|
|
|
function formatCatProds(catprods: ICatProd[] | undefined | null): string {
|
|
if (!catprods || !Array.isArray(catprods)) {
|
|
return "";
|
|
}
|
|
|
|
// Estrai il nome e il cognome di ogni autore e uniscili con ', '
|
|
return catprods
|
|
.map((catprod) => `${catprod.name ?? ""}`.trim())
|
|
.filter((name) => name.length > 0) // Filtra eventuali nomi vuoti
|
|
.join(", ");
|
|
}
|
|
|
|
// Caricamento delle preferenze al mount del componente
|
|
onMounted(() => {
|
|
const savedColumns = tools.getCookie("selColCat");
|
|
if (savedColumns) {
|
|
selectedColumns.value = savedColumns;
|
|
}
|
|
});
|
|
|
|
function showProduct(element: any) {
|
|
selProd.value = element
|
|
|
|
showProd.value = true
|
|
}
|
|
|
|
function modifyProduct(element: any) {
|
|
if (element) {
|
|
selProd.value = element
|
|
|
|
cmd.value = shared_consts.SCHEDA_PRODOTTO.CMD_MODIFICA
|
|
modifOn.value = true
|
|
}
|
|
}
|
|
|
|
function updateProduct(element: any) {
|
|
selProd.value = element
|
|
|
|
// Aggiorna l'elemento nella lista interna
|
|
internalProducts.value = internalProducts.value.map((prod: any) => {
|
|
if (prod._id === selProd.value._id) {
|
|
return selProd.value;
|
|
}
|
|
return prod;
|
|
});
|
|
|
|
emit("update:lista_prodotti", internalProducts.value); // Notifica il parent del cambiamento
|
|
|
|
}
|
|
|
|
async function updateproductmodif(element: any) {
|
|
console.log('PRODUCT TABLE: updateproductmodif')
|
|
try {
|
|
if (element?._id) {
|
|
selProd.value = await products.getProductById(element?._id)
|
|
} else {
|
|
selProd.value = await products.getProductById(selProd.value?._id)
|
|
}
|
|
|
|
// update record inside internalProducts
|
|
internalProducts.value = internalProducts.value.map((prod: any) => {
|
|
if (prod._id === selProd.value._id) {
|
|
return selProd.value;
|
|
}
|
|
return prod;
|
|
});
|
|
|
|
|
|
|
|
} catch (e) {
|
|
console.error('err', e)
|
|
}
|
|
}
|
|
|
|
async function refreshDataFromGM() {
|
|
|
|
}
|
|
async function refreshFieldFromGM(field: string) {
|
|
if (selProd.value) {
|
|
loading.value = true
|
|
updatefromgm.value = true
|
|
field_updated_fromGM.value = ''
|
|
field_updated_fromGM.value = await globalStore.getGM_FieldOf_T_Web_Articoli(selProd.value.productInfo.sku!, field, shared_consts.CmdQueryMs.GET)
|
|
loading.value = false
|
|
}
|
|
|
|
}
|
|
|
|
onMounted(mounted)
|
|
|
|
return {
|
|
allColumns,
|
|
selectedColumns,
|
|
isColumnVisible,
|
|
internalProducts,
|
|
formatAuthors,
|
|
formatCatProds,
|
|
removeProduct,
|
|
modifyProduct,
|
|
tools,
|
|
globalStore,
|
|
costanti,
|
|
onDragEnd,
|
|
showProduct,
|
|
showProd,
|
|
selProd,
|
|
cmd,
|
|
shared_consts,
|
|
updateProduct,
|
|
field_updated_fromGM,
|
|
refreshFieldFromGM,
|
|
refreshDataFromGM,
|
|
updatefromgm,
|
|
visufromgm,
|
|
loading,
|
|
showQtaDisponibile,
|
|
modifOn,
|
|
endload,
|
|
updateproductmodif,
|
|
optionscatalogo,
|
|
t,
|
|
products,
|
|
}
|
|
}
|
|
})
|