- Cataloghi: parte finale... prima bozza 9 dic

2024-12-09 12:32:19 +01:00
parent 5c20e75b6a
commit 29c59588c7
33 changed files with 1009 additions and 397 deletions
--- a/package.json
+++ b/package.json
@@ -57,8 +57,8 @@
    "html2canvas": "^1.4.1",
    "html2pdf.js": "^0.10.2",
    "jquery": "^3.7.1",
-    "jsbarcode": "^3.11.6",
    "js-cookie": "^3.0.5",
+    "jsbarcode": "^3.11.6",
    "jspdf": "^2.5.2",
    "leaflet": "^1.9.4",
    "leaflet-routing-machine": "^3.2.12",
--- a/src/components/CBarCode/CBarCode.scss
+++ b/src/components/CBarCode/CBarCode.scss
@@ -1,5 +1,5 @@
 .barcode-container {
-    padding: 5px;
+    padding: 5px 5px 5px 1px;
    display: flex;
    justify-content: center;
    align-items: center;
--- a/src/components/CBarCode/CBarCode.vue
+++ b/src/components/CBarCode/CBarCode.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="row barcode-container justify-center text-center">
+  <div class="row barcode-container">
    <div class="text-center" :style="`font-size: ${fontsize}px`">
      {{ text }}
    </div>
--- a/src/components/CCatalogo/CCatalogo.ts
+++ b/src/components/CCatalogo/CCatalogo.ts
@@ -1,31 +1,51 @@
-import { PropType, defineComponent } from 'vue'
+import { PropType, defineComponent, ref, watch } from 'vue'

-import { Catalogo } from '@src/views/ecommerce'
+import { Catalogo } from '@src/views/ecommerce/catalogo'
 import { ICatalogo } from '@src/model'

 export default defineComponent({
  name: 'CCatalogo',
  components: { Catalogo },
+  emits: ['update:modelValue', 'updateCatalogo'],
  props: {
    // add options ICatalogo
-    optcatalogo: {
+    modelValue: {
      type: Object as PropType<ICatalogo>,
-      required: false,
-      default: () => ({
-        //++AddCATALOGO_FIELDS
-        productTypes: [],
-        excludeproductTypes: [],
-        formato: [],
-        Categoria: [],
-        Editore: [],
-        pdf: false,
-      }),
+      required: true,
    },
  },

-  setup(props) {
+  setup(props, { emit }) {
+    // Crea una copia locale reattiva di modelValue
+    const localCatalogo = ref<ICatalogo>({ ...props.modelValue });
+
+    // Watcher per sincronizzare le modifiche di modelValue
+    watch(() => props.modelValue, (newVal) => {
+      localCatalogo.value = { ...newVal };
+      // updateCatalogoPadre()
+    }, { deep: true });
+
+    function updateCatalogoPadre() {
+      emit('update:modelValue', localCatalogo.value);
+      emit('updateCatalogo', localCatalogo.value);
+    }
+
+    // Metodo per aggiornare il valore del catalogo
+    const updateCatalogo = (updatedCatalogo: ICatalogo) => {
+      localCatalogo.value = updatedCatalogo; // Aggiorna la copia locale
+      updateCatalogoPadre()
+    };
+
+    function updateCatalogoEmit(updatedCatalogo: ICatalogo) {
+      console.log('updateCatalogoEmit')
+      localCatalogo.value = updatedCatalogo; // Aggiorna la copia locale
+      updateCatalogoPadre()
+      
+    }

    return {
-    }
+      localCatalogo,
+      updateCatalogoEmit,
+    };
  }
 })
--- a/src/components/CCatalogo/CCatalogo.vue
+++ b/src/components/CCatalogo/CCatalogo.vue
@@ -1,6 +1,6 @@
 <template>
  <div>
-    <Catalogo :optcatalogo="optcatalogo">
+    <Catalogo v-model="localCatalogo" @updateCatalogo="updateCatalogoEmit()">

    </Catalogo>
  </div>
--- a/src/components/CCatalogoCard/CCatalogoCard.scss
+++ b/src/components/CCatalogoCard/CCatalogoCard.scss
@@ -362,9 +362,26 @@
  z-index: 2; /* Posiziona l'immagine principale sopra l'ombra */
 }

+$grigiochiaro: rgb(180, 180, 180);
+$grigioscuro: rgb(120, 120, 120);
+
 .border-box {
-  border-left: 1px solid lightgray;
-  border-top: 1px solid lightgray;
-  border-right: 1px solid gray; 
-  border-bottom: 1px solid gray; 
+  border-left: 1px solid $grigiochiaro;
+  border-top: 1px solid $grigiochiaro;
+  border-right: 1px solid $grigioscuro; 
+  border-bottom: 1px solid $grigioscuro;
+}
+
+.etichetta{
+  margin-top: 5px;
+  margin-bottom: 5px;
+  padding-top: 5px;
+  padding-bottom: 5px;
+  font-weight: bold;
+  font-size: 1.15rem;
+}
+
+.boxtitleval{
+  padding: 10px;
+  vertical-align: middle;
 }
--- a/src/components/CCatalogoCard/CCatalogoCard.ts
+++ b/src/components/CCatalogoCard/CCatalogoCard.ts
@@ -9,11 +9,16 @@ import { CCardState } from '../CCardState'
 import { CCopyBtn } from '../CCopyBtn'
 import { CMyValueDb } from '../CMyValueDb'
 import { CPrice } from '../CPrice'
+import { CLabel } from '@src/components/CLabel'
+
 import { CBarCode } from '../CBarCode'

 import { func_tools, toolsext } from '@store/Modules/toolsext'

-import { IBaseOrder, ICatalogo, IGasordine, IMyScheda, IOrder, IOrderCart, IProduct, IVariazione } from '@src/model'
+import {
+  IBaseOrder, ICatalogo, IGasordine, IMyScheda, IOrder, IOrderCart,
+  IProduct, IVariazione
+} from '@src/model'
 import { tools } from '@store/Modules/tools'
 import { useProducts } from '@store/Products'

@@ -29,7 +34,7 @@ import 'vue3-pdf-app/dist/icons/main.css'

 export default defineComponent({
  name: 'CCatalogoCard',
-  emits: ['selauthor', 'opendetail'],
+  emits: ['selauthor', 'opendetail', 'update:modelValue'],
  props: {
    product: {
      type: Object as PropType<IProduct | null>,
@@ -56,19 +61,9 @@ export default defineComponent({
      required: false,
      default: () => { }
    },
-    optcatalogo: {
+    modelValue: {
      type: Object as PropType<ICatalogo>,
-      required: false,
-      default: () => ({
-        //++AddCATALOGO_FIELDS
-        productTypes: [0],
-        excludeproductTypes: [],
-        formato: [],
-        Categoria: [],
-        Editore: [],
-        pdf: false,
-        backgroundimage: '',
-      }),
+      required: true,
    },
    scheda: {
      type: Object as PropType<IMyScheda>,
@@ -78,7 +73,7 @@ export default defineComponent({
      }),
    },
  },
-  components: { CTitleBanner, CCardState, CCopyBtn, CMyValueDb, VuePdfApp, CPrice, CBarCode },
+  components: { CTitleBanner, CCardState, CCopyBtn, CMyValueDb, VuePdfApp, CPrice, CBarCode, CLabel },
  setup(props, { emit }) {
    const $q = useQuasar()
    const { t } = useI18n()
@@ -100,6 +95,25 @@ export default defineComponent({

    const apriSchedaPDF = ref(false)

+    // Crea una copia locale reattiva di modelValue
+    const optcatalogo = ref<ICatalogo>({ ...props.modelValue });
+
+    // Watcher per sincronizzare le modifiche di modelValue
+    watch(() => props.modelValue, (newVal) => {
+      optcatalogo.value = { ...newVal };
+      // updateCatalogoPadre()
+    }, { deep: true });
+
+    function updateCatalogoPadre() {
+      emit('update:modelValue', optcatalogo.value);
+    }
+
+    // Metodo per aggiornare il valore del catalogo
+    const updateCatalogo = (updatedCatalogo: ICatalogo) => {
+      optcatalogo.value = updatedCatalogo; // Aggiorna la copia locale
+      updateCatalogoPadre()
+    };
+
    let myorder = reactive(<IOrder>{
      idapp: process.env.APP_ID,
      quantity: 0,
@@ -112,6 +126,8 @@ export default defineComponent({

    const storeSelected = ref('')
    const arrordersCart = ref(<IOrderCart[]>[])
+    const modifOn = ref(false)
+    const modifProd = ref(false)

    const timerInterval = ref(<any>null)
    const timerLabelScadenza = ref('')
@@ -128,6 +144,29 @@ export default defineComponent({
    const startY = ref(0)
    const scale = ref(1)

+    const getTesto_Right = computed(() => {
+      return products.replaceKeyWordsByProduct(
+        optcatalogo.value,
+        myproduct.value!,
+        props.scheda!.testo_right!
+      )
+    })
+    const getTesto_Debug = computed(() => {
+      return products.replaceKeyWordsByProduct(
+        optcatalogo.value,
+        myproduct.value!,
+        { contenuto: '{debug}', maxlength: 10000 },
+      )
+    })
+
+    const getTesto_Bottom = computed(() => {
+      return products.replaceKeyWordsByProduct(
+        optcatalogo.value,
+        myproduct.value!,
+        props.scheda!.testo_bottom!
+      )
+    })
+

    watch(() => editOn.value, (to: any, from: any) => {
      if (!editOn.value)
@@ -231,7 +270,7 @@ export default defineComponent({

      if (carica) {
        myproduct.value = null;
-        myproduct.value = await products.getProductById(props.id)
+        updateproductmodif()
      }

      // products.updateQuantityAvailable(myproduct.value._id)
@@ -250,7 +289,7 @@ export default defineComponent({
    }

    async function updateproductmodif() {
-
+      console.log('updateproductmodif')
      try {
        myproduct.value = await products.getProductById(props.id)

@@ -512,11 +551,11 @@ export default defineComponent({
    }

    function click_opendetail(id: any, autore: any) {
-      if (!props.optcatalogo.pdf)
+      if (!optcatalogo.value.pdf)
        emit('opendetail')
    }
    function escludiArticolo(variazione: IVariazione) {
-      let hasExcludeProductTypes = !props.optcatalogo.excludeproductTypes || (props.optcatalogo.excludeproductTypes && (props.optcatalogo.excludeproductTypes.includes(variazione.versione!)))
+      let hasExcludeProductTypes = !optcatalogo.value.excludeproductTypes || (optcatalogo.value.excludeproductTypes && (optcatalogo.value.excludeproductTypes.includes(variazione.versione!)))

      return hasExcludeProductTypes
    }
@@ -550,6 +589,13 @@ export default defineComponent({

    }

+    function getScale() {
+      if (optcatalogo.value.printable)
+        return optcatalogo.value.areadistampa!.scale_printable
+      else
+        return optcatalogo.value.areadistampa!.scale
+    }
+
    onMounted(mounted)
    onBeforeUnmount(beforeDestroy)

@@ -608,6 +654,14 @@ export default defineComponent({
      checkIfVariazioneDaVisu,
      isProductNovita,
      isProductBestseller,
+      modifOn,
+      modifProd,
+      getTesto_Right,
+      getTesto_Bottom,
+      getTesto_Debug,
+      getScale,
+      updateCatalogo,
+      optcatalogo,
    }
  }
 })
--- a/src/components/CCatalogoCard/CCatalogoCard.vue
+++ b/src/components/CCatalogoCard/CCatalogoCard.vue
@@ -1,5 +1,6 @@
 <template>
  <div
+    v-if="optcatalogo"
    :class="{
      ' items-start q-gutter-sm': true,
    }"
@@ -23,15 +24,6 @@
        colfix_prodotti_3: options.quante_col == 'c3' && !optcatalogo.pdf,
      }"
    >
-      <q-toggle
-        v-if="tools.isManager() && !optcatalogo.pdf"
-        v-model="editOn"
-        class="absolute-top-right"
-        color="green"
-        icon="fas fa-pencil-alt"
-        dense
-      >
-      </q-toggle>
      <q-page-sticky
        v-if="complete && !optcatalogo.pdf"
        position="bottom-right"
@@ -49,29 +41,8 @@

      <q-card-section>
        <!-- per immagine di ombra -->
-        <div v-if="false" class="shadow-image-wrapper">
-          <q-img
-            src="images/ombra.png"
-            :style="{
-              position: 'absolute',
-              justifyContent: 'center',
-              width:
-                tools.adjustSize(
-                  optcatalogo,
-                  scheda.dimensioni?.immagine_prodotto?.size.width,
-                  10
-                ) ?? '100%',
-              height: tools.adjustSize(
-                optcatalogo,
-                scheda.dimensioni?.immagine_prodotto?.size.height,
-                10
-              ),
-              zIndex: 1,
-            }"
-          >
-          </q-img>
-        </div>
        <div
+          v-if="scheda.testo_right && scheda.testo_right?.font"
          :class="[
            'flex', // Classi comuni
            'image-container',
@@ -104,69 +75,70 @@
            ),
          }"
        >
-          <a :href="myproduct.productInfo.link_macro" target="_blank">
-            <q-img
-              v-if="myproduct.productInfo"
-              :src="
-                myproduct.productInfo.imagefile
-                  ? tools.getFullFileNameByImageFile(
-                      'productInfos',
-                      myproduct.productInfo.imagefile
-                    )
-                  : myproduct.productInfo.image_link
-              "
-              :alt="myproduct.productInfo.name"
-              :fit="scheda.dimensioni?.immagine_prodotto?.size?.fit ?? 'cover'"
-              :class="{
-                'book-image-fixed': complete,
-                'cursor-pointer': !complete,
-                'shadow-4': !optcatalogo.pdf,
-                'border-box': optcatalogo.pdf,
-              }"
-              :style="{
-                zIndex: 2,
-                width:
-                  scheda.testo_right.font?.posiz_text ===
-                  costanti.POSIZ_TESTO.IN_BASSO
-                    ? scheda.testo_right.font?.perc_text ?? '50%'
-                    : '45%',
-                ...(tools.adjustSize(
-                  optcatalogo,
-                  scheda.dimensioni?.immagine_prodotto?.size?.width
-                ) && {
+          <div style="position: relative; display: inline-block">
+            <a :href="myproduct.productInfo.link_macro" target="_blank">
+              <q-img
+                v-if="myproduct.productInfo"
+                :src="
+                  myproduct.productInfo.imagefile
+                    ? tools.getFullFileNameByImageFile(
+                        'productInfos',
+                        myproduct.productInfo.imagefile
+                      )
+                    : myproduct.productInfo.image_link
+                "
+                :alt="myproduct.productInfo.name"
+                :fit="
+                  scheda.dimensioni?.immagine_prodotto?.size?.fit ?? 'cover'
+                "
+                :class="{
+                  'book-image-fixed': complete,
+                  'cursor-pointer': !complete,
+                  'shadow-4': !optcatalogo.pdf,
+                  'border-box': optcatalogo.pdf,
+                }"
+                :style="{
+                  zIndex: 2,
                  width:
-                    tools.adjustSize(
-                      optcatalogo,
-                      scheda.dimensioni?.immagine_prodotto.size?.width
-                    ) + ' !important',
-                }),
-                height: scheda.dimensioni?.immagine_prodotto?.size?.height
-                  ? tools.adjustSize(
-                      optcatalogo,
-                      scheda.dimensioni?.immagine_prodotto?.size?.height
-                    )
-                  : undefined,
-                display: 'block',
-              }"
-              @click="click_opendetail()"
-            />
-          </a>
-          <span v-if="false && !optcatalogo.generazionePDFInCorso && editOn" class="prod_disp">
-            <CMyValueDb
-              v-if="editOn"
-              :editOn="editOn"
-              :title="t('products.stockQty')"
-              table="products"
-              :id="myproduct._id"
-              :rec="myproduct"
-              mykey="stockQty"
-              debounce="1000"
-              :save="updateproductmodif()"
-              :type="costanti.FieldType.number"
+                    scheda.testo_right.font?.posiz_text ===
+                    costanti.POSIZ_TESTO.IN_BASSO
+                      ? scheda.testo_right.font?.perc_text ?? '50%'
+                      : '45%',
+                  ...(tools.adjustSize(
+                    optcatalogo,
+                    scheda.dimensioni?.immagine_prodotto?.size?.width
+                  ) && {
+                    width:
+                      tools.adjustSize(
+                        optcatalogo,
+                        scheda.dimensioni?.immagine_prodotto.size?.width
+                      ) + ' !important',
+                  }),
+                  height: scheda.dimensioni?.immagine_prodotto?.size?.height
+                    ? tools.adjustSize(
+                        optcatalogo,
+                        scheda.dimensioni?.immagine_prodotto?.size?.height
+                      )
+                    : undefined,
+                  display: 'block',
+                }"
+                @click="click_opendetail()"
+              />
+            </a>
+            <q-btn
+              v-if="
+                tools.isManager() &&
+                !optcatalogo.generazionePDFInCorso &&
+                globalStore.editOn
+              "
+              icon="fas fa-pencil-alt"
+              color="primary"
+              @click.stop="modifOn = !modifOn"
+              dense
+              style="position: absolute; top: 0px; left: 0px; z-index: 3"
            >
-            </CMyValueDb>
-          </span>
-
+            </q-btn>
+          </div>
          <!-- Testo associato all'immagine -->
          <div
            :style="{
@@ -185,7 +157,7 @@
            <div
              v-if="scheda.testo_right && scheda.testo_right"
              :style="{
-                '--scalecatalog': optcatalogo.areadistampa.scale,
+                '--scalecatalog': tools.getScale(optcatalogo),
                'line-height': scheda.testo_right.font?.line_height,
                height: '100%',
                display: 'flex',
@@ -193,13 +165,7 @@
              }"
            >
              <div
-                v-html="
-                  products.replaceKeyWordsByProduct(
-                    optcatalogo,
-                    myproduct,
-                    scheda.testo_right
-                  )
-                "
+                v-html="getTesto_Right"
                style="
                  display: flex;
                  flex-direction: column;
@@ -207,7 +173,7 @@
                  height: 100%;
                "
              ></div>
-              <div class="row justify-center">
+              <div class="row">
                <div v-if="scheda.barcode && scheda.barcode.show">
                  <CBarCode
                    :value="myproduct.productInfo.code"
@@ -234,8 +200,8 @@
                  <q-img
                    src="images/bestseller.png"
                    alt="Bestseller"
-                    :width="(40 * optcatalogo.areadistampa.scale) + 'px'"
-                    :height="(40 * optcatalogo.areadistampa.scale) + 'px'"
+                    :width="40 * tools.getScale(optcatalogo) + 'px'"
+                    :height="40 * tools.getScale(optcatalogo) + 'px'"
                    fit="contain"
                  ></q-img>
                </div>
@@ -247,8 +213,8 @@
                  <q-img
                    src="images/novita.png"
                    alt="Novita"
-                    :width="(40 * optcatalogo.areadistampa.scale) + 'px'"
-                    :height="(40 * optcatalogo.areadistampa.scale) + 'px'"
+                    :width="40 * tools.getScale(optcatalogo) + 'px'"
+                    :height="40 * tools.getScale(optcatalogo) + 'px'"
                    fit="contain"
                  ></q-img>
                </div>
@@ -256,23 +222,31 @@
            </div>
          </div>
          <div
-            v-if="scheda.testo_bottom && scheda.testo_bottom.contenuto"
+            v-if="optcatalogo.indebug"
            :style="{
              width: '100%',
            }"
          >
            <div
              :style="{
-                '--scalecatalog': optcatalogo.areadistampa.scale,
+                '--scalecatalog': tools.getScale(optcatalogo),
                'line-height': scheda.testo_bottom.font?.line_height,
              }"
-              v-html="
-                products.replaceKeyWordsByProduct(
-                  optcatalogo,
-                  myproduct,
-                  scheda.testo_bottom
-                )
-              "
+              v-html="getTesto_Debug"
+            ></div>
+          </div>
+          <div
+            v-else-if="scheda.testo_bottom && scheda.testo_bottom.contenuto"
+            :style="{
+              width: '100%',
+            }"
+          >
+            <div
+              :style="{
+                '--scalecatalog': tools.getScale(optcatalogo),
+                'line-height': scheda.testo_bottom.font?.line_height,
+              }"
+              v-html="getTesto_Bottom"
            ></div>
          </div>
        </div>
@@ -485,6 +459,264 @@
        ></q-btn>
      </div>
    </q-dialog>
+    <q-dialog v-if="myproduct && modifOn" v-model="modifOn">
+      <q-card class="dialog_card">
+        <q-toolbar class="bg-primary text-white">
+          <q-toolbar-title>
+            Modifica a {{ myproduct.productInfo.name }}</q-toolbar-title
+          >
+          <q-btn flat round color="white" icon="close" v-close-popup></q-btn>
+        </q-toolbar>
+        <q-card-section class="q-pa-xs inset-shadow">
+          <div class="column">
+            <div class="etichetta">Titolo:</div>
+            <CMyValueDb
+              :editOn="modifOn"
+              table="productinfos"
+              :id="myproduct.productInfo._id"
+              :rec="myproduct.productInfo"
+              mykey="name"
+              debounce="1000"
+              :save="updateproductmodif()"
+              :type="costanti.FieldType.string"
+            >
+            </CMyValueDb>
+            <div class="etichetta">SottoTitolo:</div>
+            <CMyValueDb
+              :editOn="modifOn"
+              table="productinfos"
+              :id="myproduct.productInfo._id"
+              :rec="myproduct.productInfo"
+              mykey="sottotitolo"
+              debounce="1000"
+              :save="updateproductmodif()"
+              :type="costanti.FieldType.string"
+            >
+            </CMyValueDb>
+            <div class="etichetta">Descrizione Estesa:</div>
+            <CMyValueDb
+              :editOn="modifOn"
+              :title="t('catalogo.descrizione_estesa')"
+              table="productinfos"
+              :id="myproduct.productInfo._id"
+              :rec="myproduct.productInfo"
+              mykey="descrizione_completa_macro"
+              :maxlength="
+                scheda.testo_bottom.maxlength
+                  ? scheda.testo_bottom.maxlength
+                  : 10000
+              "
+              debounce="1000"
+              :save="updateproductmodif()"
+              :type="costanti.FieldType.string"
+            >
+            </CMyValueDb>
+            <div class="row q-ma-xm q-pa-xs">
+              <div class="boxtitleval">
+                <div class="etichetta">Pagine:</div>
+                <CMyValueDb
+                  :editOn="modifOn"
+                  :title="t('catalogo.pagine')"
+                  table="arrvariazioni"
+                  :id="myproduct._id"
+                  :rec="myproduct"
+                  mykey="pagine"
+                  debounce="1000"
+                  :save="updateproductmodif()"
+                  :type="costanti.FieldType.number"
+                >
+                </CMyValueDb>
+              </div>
+              <div class="boxtitleval">
+                <div class="etichetta">Misure:</div>
+                <CMyValueDb
+                  :editOn="modifOn"
+                  :title="t('catalogo.misure')"
+                  table="arrvariazioni"
+                  :id="myproduct._id"
+                  :rec="myproduct"
+                  mykey="misure"
+                  debounce="1000"
+                  :save="updateproductmodif()"
+                  :type="costanti.FieldType.string"
+                >
+                </CMyValueDb>
+              </div>
+              <div class="boxtitleval">
+                <div class="etichetta">Pubblicazione:</div>
+                <CMyValueDb
+                  :editOn="modifOn"
+                  :title="t('catalogo.date_pub')"
+                  table="productinfos"
+                  :id="myproduct.productInfo._id"
+                  :rec="myproduct.productInfo"
+                  mykey="date_publishing"
+                  debounce="1000"
+                  :save="updateproductmodif()"
+                  :type="costanti.FieldType.date"
+                >
+                </CMyValueDb>
+              </div>
+              <div class="boxtitleval">
+                <div class="etichetta">Formato:</div>
+                <CMyValueDb
+                  :editOn="modifOn"
+                  :title="t('catalogo.formato')"
+                  table="arrvariazioni"
+                  :id="myproduct._id"
+                  :rec="myproduct"
+                  mykey="formato"
+                  debounce="1000"
+                  :save="updateproductmodif()"
+                  :type="costanti.FieldType.string"
+                >
+                </CMyValueDb>
+              </div>
+            </div>
+            <div class="row">
+              <div class="boxtitleval">
+                <div class="etichetta">Prezzo:</div>
+                <CMyValueDb
+                  :editOn="modifOn"
+                  :title="t('catalogo.prezzo')"
+                  table="arrvariazioni"
+                  :id="myproduct._id"
+                  :rec="myproduct"
+                  mykey="price"
+                  debounce="1000"
+                  :save="updateproductmodif()"
+                  :type="costanti.FieldType.number"
+                >
+                </CMyValueDb>
+              </div>
+              <div class="boxtitleval">
+                <div class="etichetta">Prezzo Scontato:</div>
+                <CMyValueDb
+                  :editOn="modifOn"
+                  :title="t('catalogo.prezzo_scontato')"
+                  table="arrvariazioni"
+                  :id="myproduct._id"
+                  :rec="myproduct"
+                  mykey="sale_price"
+                  debounce="1000"
+                  :save="updateproductmodif()"
+                  :type="costanti.FieldType.number"
+                >
+                </CMyValueDb>
+              </div>
+            </div>
+            <div class="row">
+              <div class="boxtitleval">
+                <div class="etichetta">Descrizione breve macro:</div>
+                <CMyValueDb
+                  :editOn="modifOn"
+                  :title="t('catalogo.descrizione_breve_macro')"
+                  table="productinfos"
+                  :id="myproduct.productInfo._id"
+                  :rec="myproduct.productInfo"
+                  mykey="descrizione_breve_macro"
+                  debounce="1000"
+                  :save="updateproductmodif()"
+                  :type="costanti.FieldType.string"
+                >
+                </CMyValueDb>
+              </div>
+              <div class="boxtitleval">
+                <div class="etichetta">Link a gruppomacro.com:</div>
+                <CMyValueDb
+                  :editOn="modifOn"
+                  :title="t('catalogo.link_macro')"
+                  table="productinfos"
+                  :id="myproduct.productInfo._id"
+                  :rec="myproduct.productInfo"
+                  mykey="link_macro"
+                  debounce="1000"
+                  :save="updateproductmodif()"
+                  :type="costanti.FieldType.string"
+                >
+                </CMyValueDb>
+              </div>
+            </div>
+            <div class="row bg-blue-4">
+              <div class="etichetta">Venduti:</div>
+              <CMyValueDb
+                :editOn="modifOn"
+                table="productinfos"
+                :id="myproduct.productInfo._id"
+                :rec="myproduct.productInfo"
+                mykey="totaleVenduti"
+                debounce="1000"
+                :save="updateproductmodif()"
+                :type="costanti.FieldType.number"
+              >
+              </CMyValueDb>
+              <div class="etichetta">Venduti Ultimo Mese:</div>
+              <CMyValueDb
+                :editOn="modifOn"
+                table="productinfos"
+                :id="myproduct.productInfo._id"
+                :rec="myproduct.productInfo"
+                mykey="venditeLastM"
+                debounce="1000"
+                :save="updateproductmodif()"
+                :type="costanti.FieldType.number"
+              >
+              </CMyValueDb>
+              <div class="etichetta">Venduti Ultimi 6 Mesi:</div>
+              <CMyValueDb
+                :editOn="modifOn"
+                table="productinfos"
+                :id="myproduct.productInfo._id"
+                :rec="myproduct.productInfo"
+                mykey="venditeLast6M"
+                debounce="1000"
+                :save="updateproductmodif()"
+                :type="costanti.FieldType.number"
+              >
+              </CMyValueDb>
+              <CLabel :value="myproduct.indiceRanking" label="N° in Classifica:" />
+              
+              <div class="etichetta">3 Mesi:</div>
+              <CMyValueDb
+                :editOn="modifOn"
+                table="productinfos"
+                :id="myproduct.productInfo._id"
+                :rec="myproduct.productInfo"
+                mykey="rank3M"
+                debounce="1000"
+                :save="updateproductmodif()"
+                :type="costanti.FieldType.number"
+              >
+              </CMyValueDb>
+              <div class="etichetta">6 Mesi:</div>
+              <CMyValueDb
+                :editOn="modifOn"
+                table="productinfos"
+                :id="myproduct.productInfo._id"
+                :rec="myproduct.productInfo"
+                mykey="rank6M"
+                debounce="1000"
+                :save="updateproductmodif()"
+                :type="costanti.FieldType.number"
+              >
+              </CMyValueDb>
+              <div class="etichetta">1 Anno:</div>
+              <CMyValueDb
+                :editOn="modifOn"
+                table="productinfos"
+                :id="myproduct.productInfo._id"
+                :rec="myproduct.productInfo"
+                mykey="rank1Y"
+                debounce="1000"
+                :save="updateproductmodif()"
+                :type="costanti.FieldType.number"
+              >
+              </CMyValueDb>
+            </div>
+          </div>
+        </q-card-section>
+      </q-card>
+    </q-dialog>
  </div>
 </template>

--- a/src/components/CContainerCatalogoCard/CContainerCatalogoCard.ts
+++ b/src/components/CContainerCatalogoCard/CContainerCatalogoCard.ts
@@ -20,7 +20,7 @@ import { ICatalogo, IMyScheda, IProduct } from '@src/model'

 export default defineComponent({
  name: 'CContainerCatalogoCard',
-  emits: ['selauthor'],
+  emits: ['selauthor', 'update:modelValue'],
  props: {
    id: {
      type: String,
@@ -47,18 +47,9 @@ export default defineComponent({
      required: false,
      default: () => { }
    },
-    optcatalogo: {
+    modelValue: {
      type: Object as PropType<ICatalogo>,
-      required: false,
-      default: () => ({
-        //++AddCATALOGO_FIELDS
-        productTypes: [0],
-        excludeproductTypes: [],
-        formato: [],
-        Categoria: [],
-        Editore: [],
-        pdf: false,
-      }),
+      required: true,
    },
    scheda: {
      type: Object as PropType<IMyScheda>,
@@ -77,6 +68,25 @@ export default defineComponent({

    const opendetailbool = ref(false)

+    // Crea una copia locale reattiva di modelValue
+    const optcatalogo = ref<ICatalogo>({ ...props.modelValue });
+
+    // Watcher per sincronizzare le modifiche di modelValue
+    watch(() => props.modelValue, (newVal) => {
+      optcatalogo.value = { ...newVal };
+      // updateCatalogoPadre()
+    }, { deep: true });
+
+    function updateCatalogoPadre() {
+      emit('update:modelValue', optcatalogo.value);
+    }
+
+    // Metodo per aggiornare il valore del catalogo
+    const updateCatalogo = (updatedCatalogo: ICatalogo) => {
+      optcatalogo.value = updatedCatalogo; // Aggiorna la copia locale
+      updateCatalogoPadre()
+    };
+
    function selauthor(id: any, autore: any) {
      emit('selauthor', id, autore)
    }
@@ -102,6 +112,8 @@ export default defineComponent({
      selauthor,
      opendetail,
      opendetailbool,
+      optcatalogo,
+      updateCatalogo,
    }
  }
 })
--- a/src/components/CContainerCatalogoCard/CContainerCatalogoCard.vue
+++ b/src/components/CContainerCatalogoCard/CContainerCatalogoCard.vue
@@ -7,7 +7,7 @@
    :options="options"
    @selauthor="selauthor"
    @opendetail="opendetail"
-    :optcatalogo="optcatalogo"
+    v-model="optcatalogo"
    :scheda="scheda"
  >
  </CCatalogoCard>
@@ -32,7 +32,7 @@
              quante_col: 'c1',
              in_3d: true,
            }"
-            :optcatalogo="optcatalogo"
+            v-model="optcatalogo"
            @selauthor="selauthor"
            :scheda="scheda"
          >
--- a/src/components/CMyDimensioni/CMyDimensioni.ts
+++ b/src/components/CMyDimensioni/CMyDimensioni.ts
@@ -38,6 +38,11 @@ export default defineComponent({
      required: false,
      default: false,
    },
+    showDim: {
+      type: Boolean,
+      required: false,
+      default: true,
+    },
    disable: {
      type: Boolean,
      required: false,
--- a/src/components/CMyDimensioni/CMyDimensioni.vue
+++ b/src/components/CMyDimensioni/CMyDimensioni.vue
@@ -12,7 +12,8 @@

    <div v-if="internalModel" class="sfondo_margine row">
      <CMySize
-        label="Dinemsioni:"
+        v-if="showDim"
+        label="Dimensioni:"
        v-model="internalModel.size"
        @update:model-value="modifSize"
      ></CMySize>
--- a/src/components/CMyEditElem/CMyEditElem.ts
+++ b/src/components/CMyEditElem/CMyEditElem.ts
@@ -1,8 +1,9 @@
 import {
  defineComponent, onMounted, PropType, computed, ref, toRef, watch,
+  nextTick,
 } from 'vue'

-import { IColGridTable, IElemText, IElementiScheda, IImgGallery, ILabelValue, IMyCard, IMyElem, IMyPage, IMyScheda, IOperators, ISchedaSingola } from '@src/model'
+import { ICatalogo, IColGridTable, IElemText, IElementiScheda, IImgGallery, ILabelValue, IMyCard, IMyElem, IMyPage, IMyScheda, IOperators, ISchedaSingola } from '@src/model'
 import { useGlobalStore } from '@store/globalStore'

 import { CImgTitle } from '@/components/CImgTitle'
@@ -37,6 +38,9 @@ import { costanti } from '@costanti'
 import objectId from '@src/js/objectId'
 import { useProducts } from '@src/store/Products'

+import html2pdf from 'html2pdf.js'
+
+
 export default defineComponent({
  name: 'CMyEditElem',
  components: {
@@ -888,10 +892,135 @@ export default defineComponent({
      }
    }

+    function toggleDebug() {
+      myel.value.catalogo!.indebug = !myel.value.catalogo!.indebug      
+    }
+
+    const preparePDF = async () => {
+      myel.value.catalogo!.generazionePDFInCorso = true
+      myel.value.catalogo!.areadistampa!.scale = myel.value.catalogo!.areadistampa!.scale_printable
+    }
+
+    const terminaPDF = async () => {
+      myel.value.catalogo!.generazionePDFInCorso = false
+      myel.value.catalogo!.areadistampa!.scale = 1
+    }
+
+
+    const generatePDF = async (optcatalogo: ICatalogo) => {
+
+      await nextTick()
+
+      $q.dialog({
+        message: 'Generare il PDF ?',
+        ok: {
+          label: t('dialog.yes'),
+          push: true
+        },
+        cancel: {
+          label: t('dialog.cancel')
+        },
+        title: 'Generazione PDF'
+      }).onOk(async () => {
+
+
+        $q.loading.show({
+          message: 'Caricamento immagini e generazione PDF in corso...'
+        })
+
+
+        try {
+
+          let defaultMargin = 0.1
+          if (optcatalogo.printable) {
+            defaultMargin = 0
+          } else {
+            defaultMargin = 0
+          }
+          const unit = optcatalogo.areadistampa!.unit
+
+          let myformat = { ...optcatalogo.areadistampa!.format }
+
+          let scale = tools.getScale(optcatalogo)
+
+          let scalecanvas = optcatalogo.areadistampa!.scalecanvas
+
+          if (tools.isObject(myformat) && scale > 0) {
+          } else {
+            myformat = [210, 297]
+          }
+
+
+          const formatwidth = (myformat[0] * scale)
+          const formatheight = (myformat[1] * scale)
+
+          let myfile = (optcatalogo.pdf_filename ?? 'catalogo_completo')
+
+          myfile += '_' + formatwidth + '_' + formatheight + '_' + unit + '_scale_' + scale
+
+          myfile += '.pdf'
+
+
+          const element = document.getElementById('pdf-content')
+          const opt = {
+            margin: [
+              optcatalogo.printable ? (parseFloat(optcatalogo.areadistampa!.margini?.top) || defaultMargin) : defaultMargin,
+              optcatalogo.printable ? (parseFloat(optcatalogo.areadistampa!.margini?.left) || defaultMargin) : defaultMargin,
+              optcatalogo.printable ? (parseFloat(optcatalogo.areadistampa!.margini?.bottom) || defaultMargin) : defaultMargin,
+              optcatalogo.printable ? (parseFloat(optcatalogo.areadistampa!.margini?.right) || defaultMargin) : defaultMargin
+            ],
+            filename: myfile,
+            image: {
+              type: 'jpeg',
+              quality: 0.98
+            },
+            html2canvas: {
+              scale: scalecanvas,
+              useCORS: true,
+              letterRendering: true,
+            },
+            jsPDF: {
+              unit: unit,
+              format: [formatwidth, formatheight],
+              orientation: optcatalogo.areadistampa!.orientation,
+              compress: optcatalogo.areadistampa!.compress,
+            },
+            enableLinks: true,
+            pagebreak: { mode: 'avoid-all', before: '.card-page' }
+          }
+
+          console.log('opt di stampa', opt)
+          // a4: [595.28, 841.89]
+
+          await html2pdf().set(opt).from(element).save()
+
+          optcatalogo.generazionePDFInCorso = false
+          optcatalogo.areadistampa!.scale = 1
+
+          $q.loading.hide()
+          $q.notify({
+            color: 'positive',
+            message: 'PDF generato con successo!',
+            icon: 'check'
+          })
+        } catch (error) {
+          $q.loading.hide()
+          $q.notify({
+            color: 'negative',
+            message: 'Errore nella generazione del PDF',
+            icon: 'error'
+          })
+          console.error('Errore nella generazione del PDF:', error)
+        }
+      })
+    }
+

    onMounted(mounted)

    return {
+      preparePDF, terminaPDF, generatePDF,
+      toggleDebug,
      tools,
      shared_consts,
      getArrDisciplines,
--- a/src/components/CMyEditElem/CMyEditElem.vue
+++ b/src/components/CMyEditElem/CMyEditElem.vue
@@ -1460,7 +1460,7 @@
              dense
              dense-toggle
              expand-separator
-              label="Schede"
+              label="Configura Catalogo"
              icon="fas fa-play-circle"
            >
              <div class="row">
@@ -1473,22 +1473,29 @@
                  @click="addNewScheda"
                >
                </q-btn>
+              </div>

+              <div class="row">
                <q-tabs
                  v-model="tabScheda"
                  dense
                  class="text-grey"
                  active-color="primary"
                  indicator-color="primary"
-                  align="justify"
+                  align="center"
+                  vertical
                  narrow-indicator
                >
                  <q-tab
                    v-for="(rec, ind) in myel.catalogo.arrSchede"
                    :key="rec._id"
                    :name="ind"
-                    :label="`Scheda ` + (ind + 1)"
-                    icon="fas fa-pencil-alt"
+                    dense
+                    :label="
+                      `${ind}. ` + rec.scheda.name
+                        ? rec.scheda.name
+                        : `Scheda ` + (ind + 1)
+                    "
                  >
                  </q-tab>
                </q-tabs>
@@ -1500,7 +1507,7 @@
                    :name="ind"
                  >
                    <q-bar v-if="recscheda" class="bg-primary text-white">
-                      Scheda {{ ind + 1 }}
+                      {{ ind + 1 }}.
                      <span v-if="recscheda.scheda">
                        '{{ recscheda.scheda.name }}'</span
                      >
@@ -1568,7 +1575,7 @@
                          :options="SchedeOpt()"
                          @update:model-value="modifElem"
                          label="Scheda collegata:"
-                          style="width: 150px"
+                          style="width: 250px"
                          emit-value
                          map-options
                        >
@@ -1586,7 +1593,7 @@
                            :options="SchedeOpt()"
                            @update:model-value="modifElem"
                            label="Scegli Scheda"
-                            style="width: 150px"
+                            style="width: 250px"
                            emit-value
                            map-options
                          >
@@ -1601,6 +1608,7 @@
                          </q-btn>
                        </div>
                      </div>
+                      <br />

                      <CMySlider
                        label="Pagine max da visualizzare"
@@ -1765,6 +1773,7 @@
                        <CMyDimensioni
                          v-model="recscheda.scheda.dimensioni.riga"
                          :path="costanti.DIR_SCHEDA"
+                          :showDim="false"
                          @modifElem="modifElem"
                          :show_imgsfondo="false"
                          @update:model-value="modifElem"
@@ -2036,6 +2045,14 @@
                  @update:model-value="modifElem"
                >
                </q-toggle>
+                <q-toggle
+                  v-model="myel.catalogo.indebug"
+                  color="positive"
+                  icon="fas fa-file-pdf"
+                  label="In Debug"
+                  @update:model-value="modifElem"
+                >
+                </q-toggle>

                <q-select
                  rounded
@@ -2070,6 +2087,19 @@
                  map-options
                >
                </q-select>
+                <q-select
+                  rounded
+                  style="width: 200px"
+                  outlined
+                  v-model="myel.catalogo.areadistampa.scale_printable"
+                  :options="tools.SelectListScalePDF"
+                  @update:model-value="modifElem"
+                  dense
+                  label="Scale per Stampa:"
+                  emit-value
+                  map-options
+                >
+                </q-select>
                <q-select
                  rounded
                  style="width: 200px"
@@ -2125,6 +2155,29 @@
                ></CBorders>
              </div>
            </q-expansion-item>
+            <div></div>
+            <q-btn
+              v-if="myel.catalogo.pdf && !myel.catalogo.generazionePDFInCorso"
+              :label="`Prepara PDF ${myel.catalogo.pdf_filename}`"
+              @click="preparePDF"
+            ></q-btn>
+            <q-btn
+              v-if="myel.catalogo.generazionePDFInCorso"
+              :label="`Termina Generazione`"
+              @click="terminaPDF"
+            ></q-btn>
+            <q-btn
+              v-if="myel.catalogo.pdf && myel.catalogo.generazionePDFInCorso"
+              :label="`Genera PDF ${myel.catalogo.pdf_filename}`"
+              @click="generatePDF(myel.catalogo)"
+              color="positive"
+            ></q-btn>
+            <q-btn
+              label="Debug"
+              @click="toggleDebug()"
+              :push="myel.catalogo.indebug"
+              :color="myel.catalogo.indebug ? `positive` : 'primary'"
+            ></q-btn>
          </div>
        </div>
      </q-list>
--- a/src/components/CMyElem/CMyElem.ts
+++ b/src/components/CMyElem/CMyElem.ts
@@ -3,7 +3,7 @@ import {
  defineComponent, onMounted, PropType, ref, toRef, watch, nextTick,
 } from 'vue'

-import { ICoordGPS, IMyCard, IMyElem, IMyPage, IOperators, ISocial } from '@src/model'
+import { ICatalogo, ICoordGPS, IMyCard, IMyElem, IMyPage, IOperators, ISocial } from '@src/model'
 import { useGlobalStore } from '@store/globalStore'

 import { CImgTitle } from '../CImgTitle/index'
@@ -283,6 +283,11 @@ export default defineComponent({
      return `col-${width}`
    }

+    function updateCatalogoEmit(updatedCatalogo: ICatalogo) {
+      console.log('CMyElem: updateCatalogoEmit')
+      myel.value.catalogo = updatedCatalogo
+    }
+
    onMounted(mounted)

    return {
@@ -324,6 +329,7 @@ export default defineComponent({
      cardGroups,
      currentCardsPerSlide,
      animarecard,
+      updateCatalogoEmit,
    }
  },

--- a/src/components/CMyElem/CMyElem.vue
+++ b/src/components/CMyElem/CMyElem.vue
@@ -658,7 +658,7 @@
        </div>
        <div v-else-if="myel.type === shared_consts.ELEMTYPE.CATALOGO">
          <div v-if="editOn" class="elemEdit">PRODOTTI CATALOGO:</div>
-          <CCatalogo :optcatalogo="myel.catalogo"> </CCatalogo>
+          <CCatalogo v-model="myel.catalogo" @updateCatalogo="updateCatalogoEmit()"/>
        </div>
        <div v-else-if="myel.type === shared_consts.ELEMTYPE.MAPPA">
          <div v-if="editOn" class="elemEdit">MAPPA:</div>
--- a/src/components/CMyPopupEdit/CMyPopupEdit.ts
+++ b/src/components/CMyPopupEdit/CMyPopupEdit.ts
@@ -468,7 +468,7 @@ export default defineComponent({

      try {

-        // console.log('mounted', 'isFieldDb()', myrow.value)
+        console.log('mounted', 'isFieldDb()', myrow.value, 'sub', props.subfield, 'field', props.field)
        if (isFieldDb() && !props.isrec) {
          // console.log(' .  none...')
        } else {
@@ -480,8 +480,13 @@ export default defineComponent({
              myvalue.value = myrow.value[props.field][props.subfield]
            }
          } else {
+            let miorecord = myrow.value
+            if (props.table === 'arrvariazioni') {
+              miorecord = myrow.value.arrvariazioni[0]
+            }
+
            if (props.field !== '')
-              myvalue.value = myrow.value[props.field]
+              myvalue.value = miorecord[props.field]
            else {
              // @ts-ignore
              myvalue.value = myrow.value
@@ -578,7 +583,7 @@ export default defineComponent({
      return myval
    }*/

-    function SaveValueInt(newVal: any, valinitial: any) {
+    async function SaveValueInt(newVal: any, valinitial: any) {

      console.log('SaveValueInt', newVal, valinitial)

@@ -603,7 +608,7 @@ export default defineComponent({
      console.log('newVal', newVal)

      if (isFieldDb()) {
-        savefield(newVal, valinitial, $q)
+        await savefield(newVal, valinitial, $q)
      } else {
        // Update value in table memory
        if (props.subfield !== '') {
@@ -627,10 +632,10 @@ export default defineComponent({
    }


-    function savefield(value: any, initialval: any, myq: any) {
+    async function savefield(value: any, initialval: any, myq: any) {
      if (!props.insertMode) {
        myvalue.value = value
-        tools.saveInDBForTypes(myq, props.field, myvalue.value, props.type, props.serv, props.table, props.subfield, props.id, props.indrec, props.mysubsubkey, props.specialField)
+        return tools.saveInDBForTypes(myq, props.field, myvalue.value, props.type, props.serv, props.table, props.subfield, props.id, props.indrec, props.mysubsubkey, props.specialField)
      }
    }

--- a/src/components/CMyValueDb/CMyValueDb.ts
+++ b/src/components/CMyValueDb/CMyValueDb.ts
@@ -152,11 +152,11 @@ export default defineComponent({

    const { setValDb, getValDb } = MixinBase()

-    function showandsave(row: any, col: any, newval: any, valinitial: any) {
+    async function showandsave(row: any, col: any, newval: any, valinitial: any) {
      console.log('showandsave CMyFieldDb', row, col, newval)

      if (newval !== valinitial) {
-        tools.saveInDBForTypes($q, props.mykey, newval, props.type, props.serv, props.table, props.mysubkey, props.id, props.indrec, props.mysubsubkey, props.specialField)
+        return tools.saveInDBForTypes($q, props.mykey, newval, props.type, props.serv, props.table, props.mysubkey, props.id, props.indrec, props.mysubsubkey, props.specialField)
      }

    }
--- a/src/css/app.scss
+++ b/src/css/app.scss
@@ -2554,3 +2554,15 @@ body.body--dark {
 .uppercase {
  text-transform: uppercase;
 }
+
+.justified-text {
+  text-align: justify;
+  hyphens: auto;
+  -webkit-hyphens: auto;
+  -ms-hyphens: auto;
+  word-break: break-word;
+  overflow-wrap: break-word;
+  
+  /* Supporto per lingue specifiche */
+  lang: it; /* Imposta la lingua a italiano */
+}
--- a/src/mixins/mixin-base.ts
+++ b/src/mixins/mixin-base.ts
@@ -8,7 +8,7 @@ import MixinMetaTags from '@src/mixins/mixin-metatags'
 import { useUserStore } from '@store/UserStore'
 import { useGlobalStore } from '@store/globalStore'
 import { useQuasar } from 'quasar'
-import { IDataPass, IProducer, IProduct, ISpecialField } from '@model'
+import { IDataPass, IProducer, IProduct, IProductInfo, ISpecialField, IVariazione } from '@model'
 import { tools } from '../store/Modules/tools'
 import { costanti } from '@costanti'
 import { fieldsTable } from '@store/Modules/fieldsTable'
@@ -191,6 +191,20 @@ export default function () {
      if (idprod >= 0 && key) {
        productStore.products[idprod][key as keyof IProduct] = value
      }
+    } else if (table === 'productinfos') {
+      const productStore = useProducts()
+      const idprod = productStore.products.findIndex((rec: IProduct) => rec.productInfo._id === id)
+      if (idprod >= 0 && key) {
+        const myfield = key as keyof IProductInfo
+        productStore.products[idprod].productInfo[myfield] = value
+      }      
+    } else if (table === 'arrvariazioni') {
+      const productStore = useProducts()
+      const idprod = productStore.products.findIndex((rec: IProduct) => rec._id === id)
+      if (idprod >= 0 && key) {
+        const myfield = key as keyof IVariazione
+        productStore.products[idprod].arrvariazioni[0][myfield] = value
+      }      
    }

    console.log('mydatatosave', mydatatosave)
--- a/src/model/GlobalStore.ts
+++ b/src/model/GlobalStore.ts
@@ -754,6 +754,7 @@ export interface IAreaDiStampa {
  orientation: string
  compress: boolean
  scale: number
+  scale_printable: number
  scalecanvas: number
 }

@@ -819,6 +820,7 @@ export interface ICatalogo {
  pdf?: boolean
  pdf_filename?: string
  printable?: boolean
+  indebug?: boolean
  generazionePDFInCorso?: boolean

  first_page?: IDimensioni
--- a/src/model/Products.ts
+++ b/src/model/Products.ts
@@ -61,6 +61,7 @@ export interface IProductInfo {
 }

 export interface IVariazione {
+  _id?: string
  active?: boolean
  versione?: number
  status?: string,        
--- a/src/rootgen/admin/importdata/importdata.ts
+++ b/src/rootgen/admin/importdata/importdata.ts
@@ -79,16 +79,16 @@ export default defineComponent({
          value: shared_consts.Cmd.CAT_NO_SPAZI
        },
        {
-          label: 'Importa Cataloghi da JSON (ImportaMacro)',
-          value: shared_consts.Cmd.MACRO_CATALOGO_JSON
+          label: '1) Importa Descrizioni e Link da Sito GruppoMacro (XML)',
+          value: shared_consts.Cmd.MACRO_DESCRELINKSITOWEB
        },
        {
-          label: 'Importa Ranking da JSON (ImportaMacro)',
+          label: '2) Importa Ranking da JSON (ImportaMacro)',
          value: shared_consts.Cmd.MACRO_RANKING
        },
        {
-          label: 'Importa Descrizioni e Link da Sito GruppoMacro (XML)',
-          value: shared_consts.Cmd.MACRO_DESCRELINKSITOWEB
+          label: '3) Importa Cataloghi da JSON (ImportaMacro)',
+          value: shared_consts.Cmd.MACRO_CATALOGO_JSON
        },
      ]
    )
--- a/src/rootgen/admin/importdata/importdata.vue
+++ b/src/rootgen/admin/importdata/importdata.vue
@@ -18,9 +18,9 @@
      <q-btn v-if="cosafare === shared_consts.Cmd.PRODUCTS" label="Importa Prodotti" @click="eseguiCmdProduct"></q-btn>
      <q-btn v-else-if="cosafare === shared_consts.Cmd.PRODUCTS_V2" label="Importa Prodotti Versione 2" @click="eseguiCmdProduct"></q-btn>
      <q-btn v-else-if="cosafare === shared_consts.Cmd.INVENTARIO" label="Importa Inventario" @click="eseguiCmdInventario"></q-btn>
-      <q-btn v-else-if="cosafare === shared_consts.Cmd.MACRO_CATALOGO_JSON" label="Importa Catalogo JSON" @click="eseguiCmdCatalogoJson"></q-btn>
-      <q-btn v-else-if="cosafare === shared_consts.Cmd.MACRO_RANKING" label="Importa Ranking JSON" @click="eseguiCmdCatalogoJson"></q-btn>
-      <q-btn v-else-if="cosafare === shared_consts.Cmd.MACRO_DESCRELINKSITOWEB" label="Importa Descrizione e Link (GruppoMacro)" @click="eseguiCmdCatalogoJson"></q-btn>
+      <q-btn v-else-if="cosafare === shared_consts.Cmd.MACRO_DESCRELINKSITOWEB" label="1) Importa Descrizione e Link (GruppoMacro)" @click="eseguiCmdCatalogoJson"></q-btn>
+      <q-btn v-else-if="cosafare === shared_consts.Cmd.MACRO_RANKING" label="2) Importa Ranking JSON" @click="eseguiCmdCatalogoJson"></q-btn>
+      <q-btn v-else-if="cosafare === shared_consts.Cmd.MACRO_CATALOGO_JSON" label="3) Importa Catalogo JSON" @click="eseguiCmdCatalogoJson"></q-btn>
      <q-btn v-else label="Esegui" @click="eseguiCmd"></q-btn>
      <br>
      <q-btn label="Genera HTML Province Territoriali" @click="createProvLink"></q-btn>
--- a/src/statics/lang/it.js
+++ b/src/statics/lang/it.js
@@ -1906,6 +1906,26 @@ const msg_it = {
    catalogo: {
      text: 'Testo',
      imgsfondo_def: 'Immagine di sfondo',
+      sottotitolo: 'Sottotitolo',
+      title: 'Titolo',
+      autore: '{autore}',
+      descrizione_da_fdv: '{descrizione_da_fdv}',
+      descrizione_estesa_fdv: 'descrizione_estesa_fdv',
+      descrizione_estesa: '{descrizione_estesa}',
+      pagine: '{pagine}',
+      misure: '{misure}',
+      date_pub: '{date_pub}',
+      ranking_globale: '{ranking_globale}',
+      ranking: '{ranking}',
+      venduti: '{venduti}',
+      formato: '{formato}',
+      prezzo: '{prezzo}',
+      prezzo_scontato: '{prezzo_scontato}',
+      descrizione_completa_macro: '{descrizione_completa_macro}',
+      descrizione_breve_macro: '{descrizione_breve_macro}',
+      link_macro: '{link_macro}',
+      totaleVenduti: 'Totale Venduti',
+
    }

  },
--- a/src/store/Modules/fieldsTable.ts
+++ b/src/store/Modules/fieldsTable.ts
@@ -2281,6 +2281,21 @@ export const colTableGestoreOrdini = [
  AddCol({ name: 'status', label_trans: 'orderscart.status', fieldtype: costanti.FieldType.number }),
 ]

+export const colTableVariazioni = [
+  AddCol({ name: '_id', label_trans: 'catalogo.id', fieldtype: costanti.FieldType.string  }),
+  AddCol({ name: 'price', label_trans: 'catalogo.prezzo', fieldtype: costanti.FieldType.number  }),
+  AddCol({ name: 'sale_price', label_trans: 'catalogo.prezzo_scontato', fieldtype: costanti.FieldType.number  }),
+  AddCol({ name: 'quantita', label_trans: 'catalogo.quantita', fieldtype: costanti.FieldType.number  }),
+  AddCol({ name: 'availability', label_trans: 'catalogo.availability', fieldtype: costanti.FieldType.number  }),
+  AddCol({ name: 'formato', label_trans: 'catalogo.formato', fieldtype: costanti.FieldType.string  }),
+  AddCol({ name: 'misure', label_trans: 'catalogo.misure', fieldtype: costanti.FieldType.string  }),
+  AddCol({ name: 'tipologia', label_trans: 'catalogo.tipologia', fieldtype: costanti.FieldType.string  }),
+  AddCol({ name: 'edizione', label_trans: 'catalogo.edizione', fieldtype: costanti.FieldType.string  }),
+  AddCol({ name: 'preOrderDate', label_trans: 'catalogo.preOrderDate', fieldtype: costanti.FieldType.date  }),
+  AddCol({ name: 'addtocart_link', label_trans: 'catalogo.addtocart_link', fieldtype: costanti.FieldType.string  }),
+  AddCol({ name: 'eta', label_trans: 'catalogo.eta', fieldtype: costanti.FieldType.string  }),
+]
+
 export const colTableProductInfos = [
  AddCol({ name: 'code', label_trans: 'products.code', required: true }),
  AddCol({ name: 'codice_EAN', label_trans: 'products.codice_EAN' }),
@@ -4045,6 +4060,13 @@ export const fieldsTable = {
      colkey: '_id',
      collabel: (rec: any) => `${rec.name} (${rec.code})`,
    },
+    {
+      value: 'arrvariazioni',
+      label: 'Variazioni Prodotti',
+      columns: colTableVariazioni,
+      colkey: '_id',
+      collabel: 'price',
+    },
    {
      value: 'producers',
      label: 'Produttori',
--- a/src/store/Modules/tools.ts
+++ b/src/store/Modules/tools.ts
@@ -8903,6 +8903,17 @@ export const tools = {
    let parts = number.toFixed(2).split('.');
    return parts.length > 1 ? parts[1] : '00';
  },
+  arrotonda2Dec(number: any): string {
+    let num = ''
+    try {
+      if (number)
+        num = number.toFixed(2)
+    } catch (e) {
+      return number
+    }  
+    
+    return num
+  },

  getRecordByField(field: any, record: any) {
    let mioval = ''
@@ -9460,6 +9471,14 @@ export const tools = {
    var jsonResult = this.xmlToJson(xmlDoc);
    return jsonResult;
  },
+
+  getScale(optcatalogo: ICatalogo) {
+    if (optcatalogo.printable && optcatalogo.generazionePDFInCorso)
+      return optcatalogo.areadistampa!.scale_printable
+    else
+      return optcatalogo.areadistampa!.scale
+  },
+
  // FINE !

  // getLocale() {
--- a/src/store/Products.ts
+++ b/src/store/Products.ts
@@ -1274,13 +1274,16 @@ export const useProducts = defineStore('Products', {

      const autori = this.getAutoriByArrayAuthors(myproduct.productInfo.authors)

+
      const maxDescriptionLength = testo.maxlength ?? 100;
      const description = myproduct.productInfo.short_descr || '';
      const long_descr = myproduct.productInfo.description || '';
      const date_pub = tools.getstrDateShort(myproduct.productInfo.date_publishing) || '';
-      const ranking_globale = myproduct.productInfo.rank1Y || 0;
+      const ranking_globale = myproduct.productInfo.rank1Y! || 0;
      const ranking = myproduct.indiceRanking! || 0;
-      const venduti = myproduct.productInfo.totaleVenduti || 0;
+      const venduti = myproduct.productInfo.totaleVenduti! || 0;
+
+      const debugstr = " Rank=" + ranking + "<br> 1Y=" + (myproduct.productInfo.rank1Y! || '') + '<br> Venduti=' + venduti + '<br> Data Pubb=' + date_pub 

      const truncatedDescription = description.length > maxDescriptionLength
        ? description.substring(0, description.lastIndexOf(' ', maxDescriptionLength)) + '...'
@@ -1290,12 +1293,22 @@ export const useProducts = defineStore('Products', {
        ? long_descr.substring(0, long_descr.lastIndexOf(' ', maxDescriptionLength)) + '...'
        : long_descr;
      
+      let addtesto = false

      const long_descr_macro = myproduct.productInfo.descrizione_completa_macro || '';
-      const descrizione_completa_macro = long_descr_macro.length > maxDescriptionLength
+      if (long_descr_macro.length > maxDescriptionLength) {
+        addtesto = true
+      }
+      const addstrcontinua = '<span class="book-link">👉🏻 <a href="{link_macro}" target="_blank">continua a leggere</a></span>'
+
+      let descrizione_completa_macro = addtesto
        ? long_descr_macro.substring(0, long_descr_macro.lastIndexOf(' ', maxDescriptionLength)) + '...'
        : long_descr_macro;

+      if (addtesto) {
+        descrizione_completa_macro += addstrcontinua
+      }
+
      const short_descr = myproduct.productInfo.descrizione_breve_macro || '';
      const descrizione_breve_macro = short_descr.length > maxDescriptionLength
        ? short_descr.substring(0, short_descr.lastIndexOf(' ', maxDescriptionLength)) + '...'
@@ -1304,11 +1317,11 @@ export const useProducts = defineStore('Products', {
      const sottotitolo = myproduct.productInfo.sottotitolo || '';
      const link_macro = myproduct.productInfo.link_macro || '';

-      const prezzo = myproduct.arrvariazioni ? myproduct.arrvariazioni[0].price?.toFixed(2) : ''
-      const prezzo_scontato = myproduct.arrvariazioni ? myproduct.arrvariazioni[0].sale_price?.toFixed(2) : ''
-      const misure = myproduct.arrvariazioni ? myproduct.arrvariazioni[0].misure : ''
-      const formato = myproduct.arrvariazioni ? myproduct.arrvariazioni[0].formato : ''
-      const pagine = myproduct.arrvariazioni ? myproduct.arrvariazioni[0].pagine : ''
+      const prezzo = tools.arrotonda2Dec(myproduct.arrvariazioni![0].price) || ''
+      const prezzo_scontato = tools.arrotonda2Dec(myproduct.arrvariazioni![0].sale_price) || ''
+      const misure = myproduct.arrvariazioni![0].misure  || ''
+      const formato = myproduct.arrvariazioni![0].formato  || ''
+      const pagine = myproduct.arrvariazioni![0].pagine  || ''

      
      const scale = optcatalogo.printable ? optcatalogo.areadistampa?.scale : 1
@@ -1316,11 +1329,12 @@ export const useProducts = defineStore('Products', {
      const replacements = {
        '{autore}': autori || '',
        '{titolo}': myproduct.productInfo.name || '',
-        '{sottotitolo}': sottotitolo || '',
+        '{sottotitolo}': (sottotitolo) || '',
        '{descrizione_da_fdv}': truncatedDescription || '',
        '{descrizione_estesa_fdv}': truncatedlongDescription || '',
        '{descrizione_estesa}': descrizione_completa_macro || '',
-        '{pagine}': pagine || '',
+        '{debug}': (debugstr) || '',
+        '{pagine}': (pagine ) || '',
        '{misure}': misure || '',
        '{date_pub}': date_pub || '',
        '{ranking_globale}': ranking_globale || '',
--- a/src/views/ecommerce/catalogo/catalogo.scss
+++ b/src/views/ecommerce/catalogo/catalogo.scss
@@ -85,7 +85,7 @@ body {

 .book-descr {
  font-family: 'DINPro-BoldItalic', sans-serif;
-  font-size: calc(12 * var(--scalecatalog) * 1px);
+  font-size: calc(14 * var(--scalecatalog) * 1px);
 }

 .book-details {
@@ -93,14 +93,14 @@ body {
  margin-bottom: calc(5 * var(--scalecatalog) * 1px);
  font-size: calc(12 * var(--scalecatalog) * 1px);
  text-align: left !important;
-  margin-left: calc(8 * var(--scalecatalog) * 1px);
 }


 .book-descr-estesa {
  font-family: 'DINPro', sans-serif;
  font-size: calc(14 * var(--scalecatalog) * 1px);
-  text-align: justify !important;
+  text-align: justify;
+  word-wrap: break-word;
 }

 .book-link{
--- a/src/views/ecommerce/catalogo/catalogo.ts
+++ b/src/views/ecommerce/catalogo/catalogo.ts
@@ -16,30 +16,20 @@ import { CContainerCatalogoCard } from '@src/components/CContainerCatalogoCard'
 import { CSelectUserActive } from '@src/components/CSelectUserActive'
 import { ICatalogo, IDimensioni, IFilterCatalogo, IMyScheda, IProdView, IProduct, ISchedaSingola, ISearchList } from 'model'

-// import { VueHtmlToPaper } from 'vue-html-to-paper'
-import html2pdf from 'html2pdf.js'

 import { fieldsTable } from '@store/Modules/fieldsTable'

 export default defineComponent({
  name: 'Catalogo',
  components: { CContainerCatalogoCard, CProductCard, CSelectUserActive, CMySelect },
+  emits: ['update:modelValue', 'updateCatalogo'],
  props: {
-    optcatalogo: {
+    modelValue: {
      type: Object as PropType<ICatalogo>,
-      required: false,
-      default: () => ({
-        //++AddCATALOGO_FIELDS
-        productTypes: [0],
-        excludeproductTypes: [],
-        formato: [],
-        Categoria: [],
-        Editore: [],
-        pdf: false,
-      }),
+      required: true,
    },
  },
-  setup(props) {
+  setup(props, { emit }) {
    const userStore = useUserStore()
    const globalStore = useGlobalStore()
    const productStore = useProducts()
@@ -52,6 +42,27 @@ export default defineComponent({

    const pdfContent = ref(null);

+    const optcatalogo = ref(<ICatalogo>{ ...props.modelValue });
+
+    function updateCatalogoPadre() {
+      console.log('catalogo.ts PADRE')
+      emit('update:modelValue', optcatalogo.value);
+      //emit('updateCatalogo', optcatalogo.value);
+    }
+
+    // Metodo per aggiornare optcatalogo
+    const updateOptCatalogo = <K extends keyof ICatalogo>(key: K, value: ICatalogo[K]) => {
+      optcatalogo.value[key] = value;
+      updateCatalogoPadre()
+    }
+    // Utile anche per sincronizzare con le modifiche ricevute da props
+    watch(() => props.modelValue, (newVal) => {
+      optcatalogo.value = { ...newVal };
+    }, { deep: true });
+
+    /*watch(optcatalogo, (newValue) => {
+      emit('update:modelValue', newValue);
+    }, { deep: true });*/

    const filter = ref(<IFilterCatalogo>{
      author: '',
@@ -167,7 +178,7 @@ export default defineComponent({
      }
    })

-    watch(() => props.optcatalogo.aggiorna, (newval, oldval) => {
+    watch(() => optcatalogo.value.aggiorna, (newval, oldval) => {
      console.log('Aggiorna array...')
      generatearrProdToViewSorted()
    })
@@ -203,12 +214,12 @@ export default defineComponent({

      //++AddCATALOGO_FIELDS

-      let filtroProductTypes = props.optcatalogo.productTypes || [0]
-      let filtroExcludeProductTypes = props.optcatalogo.excludeproductTypes || [0]
+      let filtroProductTypes = optcatalogo.value.productTypes || [0]
+      let filtroExcludeProductTypes = optcatalogo.value.excludeproductTypes || [0]
      let boolfiltroVuotoProductTypes = (filtroProductTypes.length === 0 || (filtroProductTypes.length === 1 && (filtroProductTypes[0] === 0)))
      let boolfiltroVuotoExcludeProductTypes = filtroExcludeProductTypes.length === 0

-      let filtroPublishers = props.optcatalogo.Editore || []
+      let filtroPublishers = optcatalogo.value.Editore || []
      let boolfiltroVuotoEditore = (filtroPublishers.length === 0)

      //console.log('filtroVersione', filtroProductTypes)
@@ -237,17 +248,17 @@ export default defineComponent({

            //++AddCATALOGO_FIELDS

-            if (props.optcatalogo && !boolfiltroVuotoProductTypes) {
-              // check if productInfo.productTypes array includes some item in props.optcatalogo.ProductTypes array
-              hasProductTypes = !props.optcatalogo.productTypes || (props.optcatalogo.productTypes && (product.productInfo.productTypes || []).some((item: any) => props.optcatalogo.productTypes.includes(item)))
+            if (optcatalogo.value && !boolfiltroVuotoProductTypes) {
+              // check if productInfo.productTypes array includes some item in optcatalogo.value.ProductTypes array
+              hasProductTypes = !optcatalogo.value.productTypes || (optcatalogo.value.productTypes && (product.productInfo.productTypes || []).some((item: any) => optcatalogo.value.productTypes!.includes(item)))
            }
-            if (props.optcatalogo && !boolfiltroVuotoEditore) {
-              hasPublished = !props.optcatalogo.Editore || (props.optcatalogo.Editore && props.optcatalogo.Editore.includes(product.productInfo.idPublisher!))
+            if (optcatalogo.value && !boolfiltroVuotoEditore) {
+              hasPublished = !optcatalogo.value.Editore || (optcatalogo.value.Editore && optcatalogo.value.Editore.includes(product.productInfo.idPublisher!))
            }

-            if (props.optcatalogo && !boolfiltroVuotoExcludeProductTypes) {
-              // check if productInfo.productTypes array exclude some item in props.optcatalogo.ProductTypes array
-              hasExcludeProductTypes = !props.optcatalogo.excludeproductTypes || (props.optcatalogo.excludeproductTypes && (product.productInfo.productTypes || []).every((item: any) => props.optcatalogo.excludeproductTypes.includes(item)))
+            if (optcatalogo.value && !boolfiltroVuotoExcludeProductTypes) {
+              // check if productInfo.productTypes array exclude some item in optcatalogo.value.ProductTypes array
+              hasExcludeProductTypes = !optcatalogo.value.excludeproductTypes || (optcatalogo.value.excludeproductTypes && (product.productInfo.productTypes || []).every((item: any) => optcatalogo.value.excludeproductTypes!.includes(item)))
            }

            let productgassel = true
@@ -285,7 +296,7 @@ export default defineComponent({


    function sovrascriviSchedaFromTemplate(idTemplate: string, origScheda: ISchedaSingola) {
-      if (!props.optcatalogo)
+      if (!optcatalogo.value)
        return

      const arrschede: ISchedaSingola[] = globalStore.getMySchede()
@@ -314,9 +325,9 @@ export default defineComponent({

    function populateDataWithlinkIdTemplate() {

-      if (props.optcatalogo) {
+      if (optcatalogo.value) {

-        for (const recscheda of props.optcatalogo.arrSchede!) {
+        for (const recscheda of optcatalogo.value.arrSchede!) {
          if (recscheda.scheda?.linkIdTemplate) {
            // ricopia da Template:
            const myscheda = sovrascriviSchedaFromTemplate(recscheda.scheda?.linkIdTemplate, recscheda)
@@ -483,7 +494,7 @@ export default defineComponent({
    }

    function generatearrProdToViewSorted() {
-      console.log('generatearrProdToViewSorted', arrProducts.value)
+      // console.log('generatearrProdToViewSorted', arrProducts.value)

      // Svuota
      arrProdToView.value = []
@@ -494,7 +505,7 @@ export default defineComponent({
      let indprod = 0
      let indprodGenerale = 0

-      for (const recscheda of props.optcatalogo.arrSchede!) {
+      for (const recscheda of optcatalogo.value.arrSchede!) {
        if (recscheda && recscheda.scheda) {
          let schedePerRiga = recscheda.scheda.numschede_perRiga || 1
          let schedePerCol = recscheda.scheda.numschede_perCol || 1
@@ -725,98 +736,7 @@ export default defineComponent({
      })
    }

-    const generatePDF = async () => {
-      //props.optcatalogo.generazionePDFInCorso = true

-      await nextTick()
-
-      $q.loading.show({
-        message: 'Caricamento immagini e generazione PDF in corso...'
-      })
-
-
-      try {
-
-        let defaultMargin = 0.1
-        if (props.optcatalogo.printable) {
-          defaultMargin = 0
-        } else {
-          defaultMargin = 0
-        }
-        const unit = props.optcatalogo.areadistampa!.unit
-
-        let myformat = { ...props.optcatalogo.areadistampa!.format }
-
-        let scale = props.optcatalogo.areadistampa!.scale
-        let scalecanvas = props.optcatalogo.areadistampa!.scalecanvas
-
-        if (tools.isObject(myformat) && scale > 0) {
-        } else {
-          myformat = [210, 297]
-        }
-
-
-        const formatwidth = (myformat[0] * scale)
-        const formatheight = (myformat[1] * scale)
-
-        let myfile = (props.optcatalogo.pdf_filename ?? 'catalogo_completo')
-
-        myfile += '_' + formatwidth + '_' + formatheight + '_' + unit + '_scale_' + scale
-
-        myfile += '.pdf'
-
-
-        const element = document.getElementById('pdf-content')
-        const opt = {
-          margin: [
-            props.optcatalogo.printable ? (parseFloat(props.optcatalogo.areadistampa!.margini?.top) || defaultMargin) : defaultMargin,
-            props.optcatalogo.printable ? (parseFloat(props.optcatalogo.areadistampa!.margini?.left) || defaultMargin) : defaultMargin,
-            props.optcatalogo.printable ? (parseFloat(props.optcatalogo.areadistampa!.margini?.bottom) || defaultMargin) : defaultMargin,
-            props.optcatalogo.printable ? (parseFloat(props.optcatalogo.areadistampa!.margini?.right) || defaultMargin) : defaultMargin
-          ],
-          filename: myfile,
-          image: {
-            type: 'jpeg',
-            quality: 0.98
-          },
-          html2canvas: {
-            scale: scalecanvas,
-            useCORS: true,
-            letterRendering: true,
-          },
-          jsPDF: {
-            unit: unit,
-            format: [formatwidth, formatheight],
-            orientation: props.optcatalogo.areadistampa!.orientation,
-            compress: props.optcatalogo.areadistampa!.compress,
-          },
-          enableLinks: true,
-          pagebreak: { mode: 'avoid-all', before: '.card-page' }
-        }
-
-        console.log('opt di stampa', opt)
-        // a4: [595.28, 841.89]
-
-        await html2pdf().set(opt).from(element).save()
-
-        // props.optcatalogo.generazionePDFInCorso = false
-
-        $q.loading.hide()
-        $q.notify({
-          color: 'positive',
-          message: 'PDF generato con successo!',
-          icon: 'check'
-        })
-      } catch (error) {
-        $q.loading.hide()
-        $q.notify({
-          color: 'negative',
-          message: 'Errore nella generazione del PDF',
-          icon: 'error'
-        })
-        console.error('Errore nella generazione del PDF:', error)
-      }
-    }

    function groupedPages(recscheda: ISchedaSingola) {
      return recscheda.arrProdToShow
@@ -829,15 +749,15 @@ export default defineComponent({
    }

    function generateStylePageScheda(optcatalogo: ICatalogo, scheda: IMyScheda) {
-      const marginTop = scheda.dimensioni?.pagina?.dimensioni?.margini?.top ? tools.adjustSize(props.optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.margini?.top) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.top) ?? '')
-      const marginBottom = scheda.dimensioni?.pagina?.dimensioni?.margini?.bottom ? tools.adjustSize(props.optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.margini?.bottom) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.bottom) ?? '')
-      const marginLeft = scheda.dimensioni?.pagina?.dimensioni?.margini?.left ? tools.adjustSize(props.optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.margini?.left) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.left) ?? '')
-      const marginRight = scheda.dimensioni?.pagina?.dimensioni?.margini?.right ? tools.adjustSize(props.optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.margini?.right) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.right) ?? '')
+      const marginTop = scheda.dimensioni?.pagina?.dimensioni?.margini?.top ? tools.adjustSize(optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.margini?.top) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.top) || '')
+      const marginBottom = scheda.dimensioni?.pagina?.dimensioni?.margini?.bottom ? tools.adjustSize(optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.margini?.bottom) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.bottom) || '')
+      const marginLeft = scheda.dimensioni?.pagina?.dimensioni?.margini?.left ? tools.adjustSize(optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.margini?.left) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.left) || '')
+      const marginRight = scheda.dimensioni?.pagina?.dimensioni?.margini?.right ? tools.adjustSize(optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.margini?.right) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.right) || '')

-      const paddingTop = scheda.dimensioni?.pagina?.dimensioni?.padding?.top ? tools.adjustSize(props.optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.padding?.top) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.top) ?? '')
-      const paddingBottom = scheda.dimensioni?.pagina?.dimensioni?.padding?.bottom ? tools.adjustSize(props.optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.padding?.bottom) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.bottom) ?? '')
-      const paddingLeft = scheda.dimensioni?.pagina?.dimensioni?.padding?.left ? tools.adjustSize(props.optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.padding?.left) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.left) ?? '')
-      const paddingRight = scheda.dimensioni?.pagina?.dimensioni?.padding?.right ? tools.adjustSize(props.optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.padding?.right) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.right) ?? '')
+      const paddingTop = scheda.dimensioni?.pagina?.dimensioni?.padding?.top ? tools.adjustSize(optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.padding?.top) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.top) || '')
+      const paddingBottom = scheda.dimensioni?.pagina?.dimensioni?.padding?.bottom ? tools.adjustSize(optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.padding?.bottom) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.bottom) || '')
+      const paddingLeft = scheda.dimensioni?.pagina?.dimensioni?.padding?.left ? tools.adjustSize(optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.padding?.left) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.left) || '')
+      const paddingRight = scheda.dimensioni?.pagina?.dimensioni?.padding?.right ? tools.adjustSize(optcatalogo, scheda.dimensioni?.pagina?.dimensioni?.padding?.right) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.right) || '')

      // Esiste un immagine di sfondo specifica della singola pagina ?
      let fileimg = scheda.dimensioni?.pagina?.dimensioni?.imgsfondo?.imagefile
@@ -877,15 +797,15 @@ export default defineComponent({
    }

    function generateStyleByPageDim(optcatalogo: ICatalogo, mypage: IDimensioni) {
-      const marginTop = mypage!.margini?.top ? tools.adjustSize(props.optcatalogo, mypage!.margini?.top) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.top) ?? '')
-      const marginBottom = mypage!.margini?.bottom ? tools.adjustSize(props.optcatalogo, mypage!.margini?.bottom) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.bottom) ?? '')
-      const marginLeft = mypage!.margini?.left ? tools.adjustSize(props.optcatalogo, mypage!.margini?.left) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.left) ?? '')
-      const marginRight = mypage!.margini?.right ? tools.adjustSize(props.optcatalogo, mypage!.margini?.right) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.right) ?? '')
+      const marginTop = mypage!.margini?.top ? tools.adjustSize(optcatalogo, mypage!.margini?.top) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.top) || '')
+      const marginBottom = mypage!.margini?.bottom ? tools.adjustSize(optcatalogo, mypage!.margini?.bottom) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.bottom) || '')
+      const marginLeft = mypage!.margini?.left ? tools.adjustSize(optcatalogo, mypage!.margini?.left) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.left) || '')
+      const marginRight = mypage!.margini?.right ? tools.adjustSize(optcatalogo, mypage!.margini?.right) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.margini?.right) || '')

-      const paddingTop = mypage!.padding?.top ? tools.adjustSize(props.optcatalogo, mypage!.padding?.top) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.top) ?? '')
-      const paddingBottom = mypage!.padding?.bottom ? tools.adjustSize(props.optcatalogo, mypage!.padding?.bottom) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.bottom) ?? '')
-      const paddingLeft = mypage!.padding?.left ? tools.adjustSize(props.optcatalogo, mypage!.padding?.left) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.left) ?? '')
-      const paddingRight = mypage!.padding?.right ? tools.adjustSize(props.optcatalogo, mypage!.padding?.right) : (tools.adjustSize(props.optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.right) ?? '')
+      const paddingTop = mypage!.padding?.top ? tools.adjustSize(optcatalogo, mypage!.padding?.top) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.top) || '')
+      const paddingBottom = mypage!.padding?.bottom ? tools.adjustSize(optcatalogo, mypage!.padding?.bottom) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.bottom) ?? '')
+      const paddingLeft = mypage!.padding?.left ? tools.adjustSize(optcatalogo, mypage!.padding?.left) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.left) ?? '')
+      const paddingRight = mypage!.padding?.right ? tools.adjustSize(optcatalogo, mypage!.padding?.right) : (tools.adjustSize(optcatalogo, optcatalogo.dimensioni_def?.pagina?.padding?.right) ?? '')

      // Esiste un immagine di sfondo specifica della singola pagina ?
      let fileimg = mypage!.imgsfondo?.imagefile
@@ -932,8 +852,8 @@ export default defineComponent({
    }

    function getStyleRowSeparator(recscheda: ISchedaSingola) {
-      const paddingLeft = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.left) ?? '0px';
-      const paddingRight = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.right) ?? '0px';
+      const paddingLeft = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.left) ?? '0px';
+      const paddingRight = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.right) ?? '0px';

      return {
        paddingLeft: `${paddingLeft}`,
@@ -944,18 +864,18 @@ export default defineComponent({
    function getStyleRow(recscheda: ISchedaSingola) {
      const placeContent = 'center';

-      const width = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.riga?.size?.width) ?? '';
-      const height = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.riga?.size?.height);
+      const width = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.riga?.size?.width) ?? '';
+      const height = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.riga?.size?.height);

-      const marginTop = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.riga?.margini?.top) ?? '0px';
-      const marginBottom = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.riga?.margini?.bottom) ?? '0px';
-      const marginLeft = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.riga?.margini?.left) ?? '0px';
-      const marginRight = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.riga?.margini?.right) ?? '0px';
+      const marginTop = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.riga?.margini?.top) || '0';
+      const marginBottom = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.riga?.margini?.bottom) || '0';
+      const marginLeft = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.riga?.margini?.left) || '0';
+      const marginRight = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.riga?.margini?.right) || '0';

-      const paddingTop = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.riga?.padding?.top) ?? '0px';
-      const paddingBottom = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.riga?.padding?.bottom) ?? '0px';
-      const paddingLeft = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.riga?.padding?.left) ?? '0px';
-      const paddingRight = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.riga?.padding?.right) ?? '0px';
+      const paddingTop = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.riga?.padding?.top) || '0';
+      const paddingBottom = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.riga?.padding?.bottom) || '0';
+      const paddingLeft = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.riga?.padding?.left) || '0';
+      const paddingRight = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.riga?.padding?.right) || '0';

      return {
        placeContent,
@@ -971,18 +891,18 @@ export default defineComponent({
    function getStyleSchedaProdotto(recscheda: ISchedaSingola) {
      const placeContent = 'center';

-      const width = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.size?.width) ?? '100px';
-      const height = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.size?.height);
+      const width = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.size?.width) ?? '100px';
+      const height = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.size?.height);

-      const marginTop = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.margini?.top) ?? '0px';
-      const marginBottom = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.margini?.bottom) ?? '0px';
-      const marginLeft = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.margini?.left) ?? '0px';
-      const marginRight = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.margini?.right) ?? '0px';
+      const marginTop = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.margini?.top) || '0px';
+      const marginBottom = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.margini?.bottom) || '0px';
+      const marginLeft = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.margini?.left) || '0px';
+      const marginRight = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.margini?.right) || '0px';

-      const paddingTop = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.top) ?? '0px';
-      const paddingBottom = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.bottom) ?? '0px';
-      const paddingLeft = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.left) ?? '0px';
-      const paddingRight = tools.adjustSize(props.optcatalogo, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.right) ?? '0px';
+      const paddingTop = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.top) || '0px';
+      const paddingBottom = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.bottom) || '0px';
+      const paddingLeft = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.left) || '0px';
+      const paddingRight = tools.adjustSize(optcatalogo.value, recscheda.scheda?.dimensioni?.scheda_prodotto?.padding?.right) || '0px';

      return {
        placeContent,
@@ -997,7 +917,6 @@ export default defineComponent({
      return page && page.length > 0 && page[0] && page[0].length > 0
    }

-
    onMounted(mounted)

    return {
@@ -1033,7 +952,6 @@ export default defineComponent({
      mycolumns,
      tabvisu,
      getSearchText,
-      generatePDF,
      pdfContent,
      tabcatalogo,
      groupedPages,
@@ -1048,6 +966,8 @@ export default defineComponent({
      getStyleRowSeparator,
      generateStyleByPageDim,
      containsProducts,
+      updateOptCatalogo,
+      optcatalogo,
    }
  }
 })
--- a/src/views/ecommerce/catalogo/catalogo.vue
+++ b/src/views/ecommerce/catalogo/catalogo.vue
@@ -12,12 +12,7 @@
      <q-tab name="opzioni" icon="fas fa-save" label="Opzioni"> </q-tab>
    </q-tabs>
    <q-tab-panels v-model="tabcatalogo" animated class="">
-      <q-tab-panel name="visu">
-        <q-btn
-          v-if="optcatalogo.pdf"
-          :label="`Crea PDF ${optcatalogo.pdf_filename}`"
-          @click="generatePDF"
-        ></q-btn>
+      <q-tab-panel name="visu" v-if="optcatalogo">
        <div class="row justify-center q-mx-auto bg-blue-1">
          <div class="text-center">
            <q-spinner
@@ -200,6 +195,7 @@
              </div>

              <div
+                v-if="optcatalogo"
                id="pdf-content"
                ref="pdfContent"
                :class="{ 'fixed-width': true }"
@@ -245,7 +241,7 @@
                          :product="product"
                          :complete="false"
                          :cosa="cosa"
-                          :optcatalogo="optcatalogo"
+                          v-model="optcatalogo"
                          :options="{
                            show_short_descr: false,
                            show_price: false,
@@ -304,7 +300,7 @@
                                "
                                :style="{
                                  '--scalecatalog':
-                                    optcatalogo.areadistampa.scale,
+                                    tools.getScale(optcatalogo),
                                  'line-height':
                                    recscheda.scheda.dimensioni.pagina?.testo_up
                                      ?.font.line_height,
@@ -346,7 +342,7 @@
                                        :product="prod"
                                        :complete="false"
                                        :cosa="cosa"
-                                        :optcatalogo="optcatalogo"
+                                        v-model="optcatalogo"
                                        :scheda="recscheda.scheda"
                                        :options="{
                                          show_short_descr: false,
@@ -475,7 +471,73 @@
        </div>
      </q-tab-panel>
      <q-tab-panel name="opzioni">
-        <div class="row q-gutter-xs justify-center q-mx-auto bg-blue-1"></div>
+        <pre>
+          <strong>PASSI DA COMPIERE:</strong>
+
+          1. Ottenere il file delle descrizioni aggiornato (da Matteo chiedere l'export di tutti i prodotti presenti su GruppoMacro - XML)          
+          
+          2. Eseguire "IMPORTA DESCRIZIONI E LINK DA SITO GRUPPOMACRO (XML)" - importa_descrizioni_e_link.xml
+
+          3. Visualizza <a
+            href="http://vps-88271abb.vps.ovh.net/apimacro/public/view-articles-sales"
+            target="_blank"
+            >Ranking</a
+          > e controlla se tutto ok 
+          
+          4. Esporta il file del Ranking ed importarlo con "IMPORTA RANKING DA JSON"
+          <a
+            href="http://vps-88271abb.vps.ovh.net/apimacro/public/export-articles-sales-json"
+            target="_blank"
+            >Esporta Ranking</a
+          >
+
+          5. Scarica Catalogo (<a
+            href="https://www.fioredellavita.it/wp-content/uploads/woo-feed/custom/json/primofeed-2.json"
+            target="_blank"
+            >Catalogo primofeed-2.json</a
+          >)
+          
+          6. Esegui "Importa Cataloghi da JSON (ImportaMacro)"
+
+          7. GENERARE UN CATALOGO cliccando su "CREA CATALOGO ..."
+
+          8. <a
+            href="https://gruppomacro.app/admin/convertPDF"
+            target="_blank"
+            >CONVERTI IL PDF</a
+          >
+
+          ALTRO:
+
+          <a
+            href="http://vps-88271abb.vps.ovh.net/apimacro/public/getstruct/123123456"
+            target="_blank"
+            >Struttura Campi GM</a
+          >
+
+          <a
+            href="http://vps-88271abb.vps.ovh.net/apimacro/public/view-articles-sales"
+            target="_blank"
+            >Visualizza Descrizioni</a
+          >
+
+          <a
+            href="https://www.fioredellavita.it/wp-admin/admin.php?page=webappick-manage-feeds"
+            target="_blank"
+            >Gestisci Campi Catalogo FDV (CTXFEED)</a
+          >
+          <a
+            href="http://vps-88271abb.vps.ovh.net/apimacro/public/view-lista-ordini-totale/2024-11-01"
+            target="_blank"
+            >Lista Ordini Libri - Totale Venduti (scegli data)</a
+          >
+          <a
+            href="http://vps-88271abb.vps.ovh.net/apimacro/public/view-ordini-test/1000"
+            target="_blank"
+            >Lista di Tutti gli Ordini (mostra gli ultimi N)</a
+          >
+          <br />
+        </pre>
      </q-tab-panel>
    </q-tab-panels>

--- a/src/views/ecommerce/index.ts
+++ b/src/views/ecommerce/index.ts
@@ -1,2 +1 @@
 export * from './productsList'
-export * from './catalogo'
--- a/yarn.lock
+++ b/yarn.lock
@@ -8736,7 +8736,7 @@ js-yaml@~3.7.0:
    argparse "^1.0.7"
    esprima "^2.6.0"

-jsbarcode@^3.11.6, jsbarcode@^3.5.8:
+jsbarcode@^3.11.6:
  version "3.11.6"
  resolved "https://registry.yarnpkg.com/jsbarcode/-/jsbarcode-3.11.6.tgz#96e8fbc3395476e162982a6064b98a09b5ea02c0"
  integrity sha512-G5TKGyKY1zJo0ZQKFM1IIMfy0nF2rs92BLlCz+cU4/TazIc4ZH+X1GYeDRt7TKjrYqmPfTjwTBkU/QnQlsYiuA==
@@ -13478,13 +13478,6 @@ vendors@^1.0.0:
  resolved "https://registry.yarnpkg.com/vendors/-/vendors-1.0.4.tgz#e2b800a53e7a29b93506c3cf41100d16c4c4ad8e"
  integrity sha512-/juG65kTL4Cy2su4P8HjtkTxk6VmJDiOPBufWniqQ6wknac6jNiXS9vU+hO3wgusiyqWlzTbVHi0dyJqRONg3w==

-vue-barcode@^1.3.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/vue-barcode/-/vue-barcode-1.3.0.tgz#c1a4fede73b2d45cdd154a176d6fd0e20fb32df0"
-  integrity sha512-DxQ0hxes/dP6GajsJumpW6jV14VwlnTwStZbtE6G0wkewuJVDoDOdxUr5seGuxsMT9fJ0aty4X47Z5TG0M/gxg==
-  dependencies:
-    jsbarcode "^3.5.8"
-
 vue-class-component@^6.0.0, vue-class-component@^6.2.0:
  version "6.3.2"
  resolved "https://registry.yarnpkg.com/vue-class-component/-/vue-class-component-6.3.2.tgz#e6037e84d1df2af3bde4f455e50ca1b9eec02be6"