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

- generazione del PDF riscritto totalmente

Browse Source 
- ora è possibile generarlo anche da backend
- FIX: corretto la qualità del PDF e la dimensione non esatta in pixel...
This commit is contained in:
Surya Paolo
2025-05-29 18:23:02 +02:00
parent 884afe4eb5
commit 67aaf719f4
32 changed files with 2881 additions and 1748 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/CCatalogo/CCatalogo.vue
View File

@@ -1,9 +1,7 @@
<template>
<div>
<Catalogo v-model="localCatalogo" @updateCatalogo="updateCatalogoEmit()" :idPage="idPage">
<Catalogo v-model="localCatalogo" @updateCatalogo="updateCatalogoEmit()" :idPage="idPage">
</Catalogo>
</div>
</Catalogo>
</template>
<script lang="ts" src="./CCatalogo.ts">

2
src/components/CCatalogoCard/CCatalogoCard.scss
View File

@@ -393,7 +393,7 @@ $grigioscuro: rgb(120, 120, 120);
.flex-details_and_barcode {
display: flex; /* Rende il div un container flex per allineare i contenuti */
align-items: center; /* Allineamento verticale al centro */
padding-top: calc(5 * var(--scalecatalog) * 1px);
padding-top: calc(5 * var(--scalecatalogy) * 1px);
justify-content: space-between !important;
flex-grow: 0; /* Opzionale: permette agli elementi di crescere uniformemente */
}

22
src/components/CCatalogoCard/CCatalogoCard.ts
View File

@@ -137,9 +137,20 @@ export default defineComponent({
const field_updated_fromGM = ref('');
const dataextractedWeb = ref('');
const widthoggetto = ref(40)
const heightoggetto = ref(40)
// Crea una copia locale reattiva di modelValue
const optcatalogo = ref<IOptCatalogo>({ ...props.modelValue });
const mywidthogg = computed(() => {
return widthoggetto.value * tools.getScaleX(optcatalogo.value, props.scheda)
})
const myheightogg = computed(() => {
return heightoggetto.value * tools.getScaleY(optcatalogo.value, props.scheda)
})
const editOn = computed({
get(): boolean {
return globalStore.editOn ? globalStore.editOn : false;
@@ -694,12 +705,6 @@ export default defineComponent({
return false;
}
function getScale() {
if (optcatalogo.value.printable)
return optcatalogo.value.areadistampa!.scale_printable;
else return optcatalogo.value.areadistampa!.scale;
}
/*async function refreshDataFromGM() {
if (myproduct.value) {
loading.value = true
@@ -894,7 +899,6 @@ export default defineComponent({
getTesto_Right_attaccato,
getTesto_Bottom,
getTesto_Debug,
getScale,
updateCatalogo,
optcatalogo,
visufromgm,
@@ -911,6 +915,10 @@ export default defineComponent({
loading,
modifTrafiletto,
getDataExtracted,
widthoggetto,
heightoggetto,
mywidthogg,
myheightogg
};
},
});

179
src/components/CCatalogoCard/CCatalogoCard.vue
View File

@@ -2,14 +2,16 @@
<div
v-if="optcatalogo"
:class="{
' items-start q-gutter-sm': true,
' items-start': true,
}"
:style="
scheda.dimensioni?.pagina?.dimensioni?.size?.height
? ' height: ' +
tools.adjustSize(
optcatalogo,
scheda.dimensioni?.pagina?.dimensioni?.size?.height
scheda.dimensioni?.pagina?.dimensioni?.size?.height,
scheda,
false
) +
'px !important; '
: ''
@@ -54,8 +56,7 @@
'flex', // Classi comuni
'image-container',
{ 'shadow-2': options.in_3d && !optcatalogo.pdf }, // Classe condizionale
scheda.testo_right_attaccato.font?.posiz_text ===
costanti.POSIZ_TESTO.IN_BASSO
scheda.testo_right_attaccato.font?.posiz_text === costanti.POSIZ_TESTO.IN_BASSO
? ''
: 'flex flex-row', // Layout flessibile
]"
@@ -63,16 +64,22 @@
gap:
tools.adjustSize(
optcatalogo,
scheda.dimensioni?.scheda_prodotto?.size?.gap
scheda.dimensioni?.scheda_prodotto?.size?.gap,
scheda,
true
) ?? '0.1rem',
width:
tools.adjustSize(
optcatalogo,
scheda.dimensioni?.scheda_prodotto?.size?.width
scheda.dimensioni?.scheda_prodotto?.size?.width,
scheda,
true
) ?? '100%',
height: tools.adjustSize(
optcatalogo,
scheda.dimensioni?.scheda_prodotto?.size?.height
scheda.dimensioni?.scheda_prodotto?.size?.height,
scheda,
false
),
}"
>
@@ -92,9 +99,7 @@
: myproduct.productInfo.image_link
"
:alt="myproduct.productInfo.name"
:fit="
scheda.dimensioni?.immagine_prodotto?.size?.fit ?? 'cover'
"
:fit="scheda.dimensioni?.immagine_prodotto?.size?.fit ?? 'cover'"
:class="{
'book-image-fixed': complete,
'cursor-pointer': !complete,
@@ -104,24 +109,29 @@
:style="{
zIndex: 2,
width:
scheda.testo_right.font?.posiz_text ===
costanti.POSIZ_TESTO.IN_BASSO
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
scheda.dimensioni?.immagine_prodotto?.size?.width,
scheda,
true
) && {
width:
tools.adjustSize(
optcatalogo,
scheda.dimensioni?.immagine_prodotto.size?.width
scheda.dimensioni?.immagine_prodotto.size?.width,
scheda,
true
) + ' !important',
}),
height: scheda.dimensioni?.immagine_prodotto?.size?.height
? tools.adjustSize(
optcatalogo,
scheda.dimensioni?.immagine_prodotto?.size?.height
scheda.dimensioni?.immagine_prodotto?.size?.height,
scheda,
false
)
: undefined,
display: 'block',
@@ -129,7 +139,14 @@
@click="click_opendetail()"
/>
</a>
<div class="q-ma-sm no-print">
<div
v-if="
(tools.isManager() || tools.isEditor()) &&
!optcatalogo.generazionePDFInCorso &&
(editOn || options.show_edit_book)
"
class="no-print"
>
<div
class="row absolute-top-left semi-transparent"
style="z-index: 10"
@@ -212,8 +229,7 @@
</q-item>-->
<q-item
v-if="
!optcatalogo.generazionePDFInCorso &&
(editOn || options.show_edit_book)
!optcatalogo.generazionePDFInCorso && (editOn || options.show_edit_book)
"
clickable
v-close-popup
@@ -316,8 +332,7 @@
</q-item>
<q-item
v-if="
!optcatalogo.generazionePDFInCorso &&
(editOn || options.show_edit_book)
!optcatalogo.generazionePDFInCorso && (editOn || options.show_edit_book)
"
clickable
v-close-popup
@@ -331,10 +346,7 @@
/>
</q-item-section>
<q-item-section>
<q-item-label
>Visualizza dati Estrapolati (dal WEB
Esterno)</q-item-label
>
<q-item-label>Visualizza dati Estrapolati (dal WEB Esterno)</q-item-label>
</q-item-section>
</q-item>
@@ -380,10 +392,7 @@
/>
</q-item-section>
<q-item-section>
<q-item-label
>Visualizza su GM (con le Quantità in
Magazzino)</q-item-label
>
<q-item-label>Visualizza su GM (con le Quantità in Magazzino)</q-item-label>
</q-item-section>
</q-item>
</q-list>
@@ -401,19 +410,14 @@
:idPage="idPage"
>
<div
v-if="
scheda.testo_right_attaccato.font?.posiz_text !==
costanti.POSIZ_TESTO.IN_BASSO
"
v-if="scheda.testo_right_attaccato.font?.posiz_text !== costanti.POSIZ_TESTO.IN_BASSO"
:style="{
alignSelf:
scheda.testo_right_attaccato.font?.posiz_text ===
costanti.POSIZ_TESTO.IN_BASSO
scheda.testo_right_attaccato.font?.posiz_text === costanti.POSIZ_TESTO.IN_BASSO
? ''
: 'center',
marginTop:
scheda.testo_right_attaccato.font?.posiz_text ===
costanti.POSIZ_TESTO.IN_BASSO
scheda.testo_right_attaccato.font?.posiz_text === costanti.POSIZ_TESTO.IN_BASSO
? 'auto'
: '0',
}"
@@ -432,54 +436,37 @@
:value="myproduct.productInfo.code"
:format="scheda.barcode.format"
:fontsizeprop="scheda.barcode.font?.size"
:gap="
tools.adjustSize(optcatalogo, scheda.barcode.size?.gap)
"
:gap="tools.adjustSize(optcatalogo, scheda.barcode.size?.gap, scheda, true)"
:width="
parseInt(
tools.adjustSize(
optcatalogo,
scheda.barcode.size?.width
)
tools.adjustSize(optcatalogo, scheda.barcode.size?.width, scheda, true)
)
"
:widthlines="
tools.adjustSize(optcatalogo, scheda.barcode.widthlines)
tools.adjustSize(optcatalogo, scheda.barcode.widthlines, scheda, true)
"
:height="
tools.adjustSize(
optcatalogo,
scheda.barcode.size?.height
)
tools.adjustSize(optcatalogo, scheda.barcode.size?.height, scheda, false)
"
:show_at_right="scheda.barcode?.show_at_right"
>
</CBarCode>
</div>
<div
v-if="
scheda.etichette?.bestseller?.show &&
isProductBestseller()
"
>
<div v-if="scheda.etichette?.bestseller?.show && isProductBestseller()">
<q-img
src="/images/bestseller.png"
alt="Bestseller"
:width="40 * tools.getScale(optcatalogo) + 'px'"
:height="40 * tools.getScale(optcatalogo) + 'px'"
:width="mywidthogg + 'px'"
:height="myheightogg + 'px'"
fit="contain"
></q-img>
</div>
<div
v-else-if="
scheda.etichette?.novita?.show && isProductNovita()
"
>
<div v-else-if="scheda.etichette?.novita?.show && isProductNovita()">
<q-img
src="/images/novita.png"
alt="Novita"
:width="40 * tools.getScale(optcatalogo) + 'px'"
:height="40 * tools.getScale(optcatalogo) + 'px'"
:width="mywidthogg + 'px'"
:height="myheightogg + 'px'"
fit="contain"
></q-img>
</div>
@@ -488,10 +475,7 @@
</div>
</CText>
<div
v-if="
scheda.testo_right_attaccato.font?.posiz_text ===
costanti.POSIZ_TESTO.IN_BASSO
"
v-if="scheda.testo_right_attaccato.font?.posiz_text === costanti.POSIZ_TESTO.IN_BASSO"
class="flexible-width"
:style="{
marginTop: 'auto',
@@ -511,50 +495,37 @@
:value="myproduct.productInfo.code"
:format="scheda.barcode.format"
:fontsizeprop="scheda.barcode.font?.size"
:gap="
tools.adjustSize(optcatalogo, scheda.barcode.size?.gap)
"
:gap="tools.adjustSize(optcatalogo, scheda.barcode.size?.gap, scheda, true)"
:width="
parseInt(
tools.adjustSize(
optcatalogo,
scheda.barcode.size?.width
)
tools.adjustSize(optcatalogo, scheda.barcode.size?.width, scheda, true)
)
"
:widthlines="
tools.adjustSize(optcatalogo, scheda.barcode.widthlines)
tools.adjustSize(optcatalogo, scheda.barcode.widthlines, scheda, true)
"
:height="
tools.adjustSize(optcatalogo, scheda.barcode.size?.height)
tools.adjustSize(optcatalogo, scheda.barcode.size?.height, scheda, false)
"
:show_at_right="scheda.barcode.show_at_right"
>
</CBarCode>
</div>
<div
v-if="
scheda.etichette?.bestseller?.show && isProductBestseller()
"
>
<div v-if="scheda.etichette?.bestseller?.show && isProductBestseller()">
<q-img
src="/images/bestseller.png"
alt="Bestseller"
:width="40 * tools.getScale(optcatalogo) + 'px'"
:height="40 * tools.getScale(optcatalogo) + 'px'"
:width="mywidthogg + 'px'"
:height="myheightogg + 'px'"
fit="contain"
></q-img>
</div>
<div
v-else-if="
scheda.etichette?.novita?.show && isProductNovita()
"
>
<div v-else-if="scheda.etichette?.novita?.show && isProductNovita()">
<q-img
src="/images/novita.png"
alt="Novita"
:width="40 * tools.getScale(optcatalogo) + 'px'"
:height="40 * tools.getScale(optcatalogo) + 'px'"
:width="mywidthogg + 'px'"
:height="myheightogg + 'px'"
fit="contain"
></q-img>
</div>
@@ -570,7 +541,8 @@
>
<div
:style="{
'--scalecatalog': tools.getScale(optcatalogo),
'--scalecatalogx': tools.getScaleX(optcatalogo, scheda),
'--scalecatalogy': tools.getScaleY(optcatalogo, scheda),
'line-height': scheda.testo_bottom.font?.line_height,
}"
v-html="getTesto_Debug"
@@ -651,14 +623,10 @@
</div>
</td>
<td class="text-center">
<strong>{{
tools.getNomeUtenteEUsernameByRecUser(ordcart.user)
}}</strong>
<strong>{{ tools.getNomeUtenteEUsernameByRecUser(ordcart.user) }}</strong>
</td>
<td class="text-center">
<strong>{{
shared_consts.getStatusStr(ordcart.status)
}}</strong>
<strong>{{ shared_consts.getStatusStr(ordcart.status) }}</strong>
</td>
<td class="text-center">
<div
@@ -667,8 +635,7 @@
>
<span
v-if="
singleord.order.idProduct === myproduct._id &&
singleord.order.quantity > 0
singleord.order.idProduct === myproduct._id && singleord.order.quantity > 0
"
>
{{ singleord.order.quantity }}</span
@@ -703,12 +670,7 @@
</q-dialog>
<q-dialog
v-if="
true &&
myproduct &&
myproduct.productInfo &&
myproduct.productInfo.link_scheda
"
v-if="true && myproduct && myproduct.productInfo && myproduct.productInfo.link_scheda"
v-model="apriSchedaPDF"
maximized
>
@@ -745,12 +707,7 @@
</q-dialog>
<q-dialog
v-if="
false &&
myproduct &&
myproduct.productInfo &&
myproduct.productInfo.link_scheda
"
v-if="false && myproduct && myproduct.productInfo && myproduct.productInfo.link_scheda"
v-model="apriSchedaPDF"
fullscreen
>

2
src/components/CMyDialog/CMyDialog.vue
View File

@@ -1,5 +1,5 @@
<template>
<div :class="class">
<div v-if="internalModel" :class="class">
<q-dialog
v-model="internalModel"
maximized

10
src/components/CMyEditElem/CMyEditElem.ts
View File

@@ -14,6 +14,7 @@ import type {
} from '@src/model';
import { IImgGallery, ILabelValue, IMyPage, IOperators } from '@src/model';
import { useGlobalStore } from '@store/globalStore';
import { useCatalogStore } from '@store/catalogStore';
import { CImgTitle } from '@src/components/CImgTitle';
import { CImgPoster } from '@src/components/CImgPoster';
@@ -28,6 +29,7 @@ import { CMyPageIntro } from '@src/components/CMyPageIntro';
import { CEventsCalendar } from '@src/components/CEventsCalendar';
import { CMyEditor } from '@src/components/CMyEditor';
import { CMySlider } from '@src/components/CMySlider';
import { CMySlideNumber } from '@src/components/CMySlideNumber';
import { CMyFieldRec } from '@src/components/CMyFieldRec';
import { CSelectImage } from '@src/components/CSelectImage';
import { CSelectAnimation } from '@src/components/CSelectAnimation';
@@ -69,7 +71,7 @@ export default defineComponent({
CMySize,
CBorders,
CMyDimensioni,
CMyText,
CMyText, CMySlideNumber,
},
emits: ['saveElem', 'selElemClick', 'toggleSize', 'deleteElem', 'dupPage', 'expPage', 'impPage'],
props: {
@@ -100,6 +102,7 @@ export default defineComponent({
},
setup(props, { emit }) {
const globalStore = useGlobalStore();
const catalogStore = useCatalogStore();
const { setmeta, getsrcbyimg } = MixinMetaTags();
const { setValDb, getValDb } = MixinBase();
@@ -347,7 +350,6 @@ export default defineComponent({
myel.value.catalogo.areadistampa.margini = { left: '0.59', top: '0.59', right: '0.59', bottom: '0.28' };
myel.value.catalogo.print_isTemplate = false;
myel.value.catalogo.print_linkIdTemplate = '';
myel.value.catalogo.print_linkIdTemplatePerStampa = '';
}
myel.value.catalogo.areadistampa = tools.resetRecIAreaDiStampa(myel.value.catalogo.areadistampa);
@@ -357,7 +359,8 @@ export default defineComponent({
myel.value.catalogo.dimensioni_def = {
isTemplate: false,
linkIdTemplate: '',
linkIdTemplatePerStampa: '',
scalexscheda: 1,
scaleyscheda: 1,
name: '',
pagina: {},
};
@@ -810,6 +813,7 @@ export default defineComponent({
exportPage,
importPage,
globalStore,
catalogStore,
};
},
});

132
src/components/CMyEditElem/CMyEditElem.vue
View File

@@ -1606,6 +1606,28 @@
@update:model-value="modifElem"
>
</q-toggle>
<q-toggle
v-model="myel.catalogo.showOnlyCatalogoPDF"
color="positive"
icon="fas fa-file-pdf"
label="Pagina solo Catalogo (PDF)"
@update:model-value="modifElem"
>
</q-toggle>
<q-select
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
rounded
outlined
v-model="myel.catalogo.idCatalogSel"
:options="catalogStore.getCatalogsList()"
@update:model-value="modifElem"
label="Scegli il Catalogo"
style="width: 300px"
emit-value
map-options
>
</q-select>
<q-toggle
v-model="myel.catalogo.showListaCollane"
color="positive"
@@ -1818,20 +1840,6 @@
map-options
>
</q-select>
<q-select
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
v-if="enableEdit"
rounded
outlined
v-model="myel.catalogo.dimensioni_def.linkIdTemplatePerStampa"
:options="Products.getOptCatalogoTemplate()"
@update:model-value="modifElem"
label="Catalogo collegato per STAMPA:"
style="width: 250px"
emit-value
map-options
>
</q-select>
<div
v-if="myel.catalogo.dimensioni_def.pagina"
@@ -1979,20 +1987,21 @@
map-options
>
</q-select>
<q-select
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
v-if="enableEdit"
rounded
outlined
v-model="recscheda.scheda.linkIdTemplatePerStampa"
:options="globalStore.getSchedeOpt()"
<CMySlideNumber
v-model="recscheda.scheda.scalex"
label="Scale X:"
:min="0.5"
:max="1.5"
@update:model-value="modifElem"
label="Scheda collegata STAMPA:"
style="width: 350px"
emit-value
map-options
>
</q-select>
/>
<CMySlideNumber
v-model="recscheda.scheda.scaley"
label="Scale Y:"
:min="0.5"
:max="1.5"
@update:model-value="modifElem"
/>
<br />
<div class="row">
<q-select
@@ -2477,20 +2486,6 @@
map-options
>
</q-select>
<q-select
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
v-if="enableEdit"
rounded
outlined
v-model="myel.catalogo.print_linkIdTemplatePerStampa"
:options="Products.getOptCatalogoPrintTemplate()"
@update:model-value="modifElem"
label="Catalogo Stampa collegato per STAMPA:"
style="width: 350px"
emit-value
map-options
>
</q-select>
<div
:class="{
@@ -2536,30 +2531,53 @@
</div>
<q-select
rounded
style="width: 200px"
style="width: 350px"
outlined
v-model="myel.catalogo.areadistampa.scale"
:options="tools.SelectListScalePDF"
v-model="myel.catalogo.areadistampa.format_printable"
:options="tools.SelectListFormatPDF"
@update:model-value="modifElem"
dense
label="Scale:"
label="Formato per Stampa:"
emit-value
map-options
>
</q-select>
<q-select
rounded
style="width: 200px"
outlined
v-model="myel.catalogo.areadistampa.scale_printable"
:options="tools.SelectListScalePDF"
<div v-if="myel.catalogo.areadistampa.format_printable?.length > 1">
Ratio:
{{
myel.catalogo.areadistampa.format_printable[0] /
myel.catalogo.areadistampa.format_printable[1]
}}
</div>
<CMySlideNumber
v-model="myel.catalogo.areadistampa.scalex"
label="Scale X:"
:min="0.5"
:max="1.5"
@update:model-value="modifElem"
dense
label="Scale per Stampa:"
emit-value
map-options
>
</q-select>
/>
<CMySlideNumber
v-model="myel.catalogo.areadistampa.scaley"
label="Scale Y:"
:min="0.5"
:max="1.5"
@update:model-value="modifElem"
/>
<CMySlideNumber
v-model="myel.catalogo.areadistampa.scale_printablex"
label="Scale X Stampa:"
:min="0.5"
:max="1.5"
@update:model-value="modifElem"
/>
<CMySlideNumber
v-model="myel.catalogo.areadistampa.scale_printabley"
label="Scale Y Stampa:"
:min="0.5"
:max="1.5"
@update:model-value="modifElem"
/>
<q-select
rounded
style="width: 200px"

186
src/components/CMyPageElem/CMyPageElem.ts
View File

@@ -1,31 +1,34 @@
import {
computed,
defineComponent, onMounted, ref, toRef, watch,
} from 'vue'
import { computed, defineComponent, onMounted, ref, toRef, watch } from 'vue';
import type { IMyElem, IMyPage } from '@src/model'
import { useGlobalStore } from '@store/globalStore'
import { LandingFooter } from '@src/components/LandingFooter'
import { CMyElem } from '@src/components/CMyElem'
import { CTitleBanner } from '@src/components/CTitleBanner'
import { CMyEditElem } from '@src/components/CMyEditElem'
import { CMyPageElem2 } from '@src/components/CMyPageElem2'
import { CExportImportPage } from '@src/components/CExportImportPage'
import type { IMyElem, IMyPage } from '@src/model';
import { useGlobalStore } from '@store/globalStore';
import { LandingFooter } from '@src/components/LandingFooter';
import { CMyElem } from '@src/components/CMyElem';
import { CTitleBanner } from '@src/components/CTitleBanner';
import { CMyEditElem } from '@src/components/CMyEditElem';
import { CMyPageElem2 } from '@src/components/CMyPageElem2';
import { CExportImportPage } from '@src/components/CExportImportPage';
import { CImgTitle } from '../CImgTitle/index'
import { CTitle } from '../CTitle/index'
import { tools } from '@tools'
import { useQuasar } from 'quasar'
import { useI18n } from 'vue-i18n'
import { shared_consts } from '@src/common/shared_vuejs'
import objectId from '@src/js/objectId'
import { useRouter } from 'vue-router'
import { CImgTitle } from '../CImgTitle/index';
import { CTitle } from '../CTitle/index';
import { tools } from '@tools';
import { useQuasar } from 'quasar';
import { useI18n } from 'vue-i18n';
import { shared_consts } from '@src/common/shared_vuejs';
import objectId from '@src/js/objectId';
import { useRouter } from 'vue-router';
export default defineComponent({
name: 'CMyPageElem',
components: {
LandingFooter, CImgTitle, CTitle, CMyElem,
CMyEditElem, CMyPageElem2, CTitleBanner, CExportImportPage,
LandingFooter,
CImgTitle,
CTitle,
CMyElem,
CMyEditElem,
CMyPageElem2,
CTitleBanner,
CExportImportPage,
},
props: {
title: String,
@@ -36,7 +39,7 @@ export default defineComponent({
idPage: {
type: String,
required: false,
default: ''
default: '',
},
img: {
type: String,
@@ -66,64 +69,73 @@ export default defineComponent({
},
setup(props) {
const rec = ref<IMyPage | null>(null)
const mypathin = toRef(props, 'mypath')
const myidPage = toRef(props, 'idPage')
const rec = ref<IMyPage | null>(null);
const mypathin = toRef(props, 'mypath');
const myidPage = toRef(props, 'idPage');
const $q = useQuasar()
const $q = useQuasar();
const { t } = useI18n()
const globalStore = useGlobalStore()
const $router = useRouter()
const { t } = useI18n();
const globalStore = useGlobalStore();
const $router = useRouter();
const mywidthEditor = ref(400)
const mywidthEditor = ref(400);
const showexportPage = ref(false)
const showimportPage = ref(false)
const showexportPage = ref(false);
const showimportPage = ref(false);
const editOn = computed({
get(): boolean {
return !!globalStore.editOn ? globalStore.editOn : false
return !!globalStore.editOn ? globalStore.editOn : false;
},
set(value: boolean) {
return tools.updateEditOn(value)
}
})
const visuEditor = ref(false)
const addOn = ref(false)
const myelemVoid = ref({ _id: objectId(), active: true, type: shared_consts.ELEMTYPE.TEXT, container: '...', path: mypathin.value } as IMyElem)
return tools.updateEditOn(value);
},
});
const visuEditor = ref(false);
const addOn = ref(false);
const myelemVoid = ref({
_id: objectId(),
active: true,
type: shared_consts.ELEMTYPE.TEXT,
container: '...',
path: mypathin.value,
} as IMyElem);
const selElem = ref(<IMyElem | null>globalStore.selElem);
const site = ref(globalStore.site);
const selElem = ref(<IMyElem | null>globalStore.selElem)
const site = ref(globalStore.site)
const onloading = ref(false)
const onloading = ref(false);
const myelems = computed(() => {
if (myidPage.value)
return globalStore.getMyElemsByIdPage(myidPage.value)
else if (mypathin.value)
return globalStore.getMyElems(mypathin.value)
else
return null
})
if (myidPage.value) return globalStore.getMyElemsByIdPage(myidPage.value);
else if (mypathin.value) return globalStore.getMyElems(mypathin.value);
else return null;
});
async function load() {
console.log('load', mypathin.value, 'idapp', tools.getEnv('VITE_APP_ID'))
console.log('load', mypathin.value, 'idapp', tools.getEnv('VITE_APP_ID'));
if (mypathin.value !== '') {
onloading.value = true
await globalStore.loadPage('/' + mypathin.value, 'cmypageelem')
.then(ris => {
rec.value = ris
// console.log('LoadPage', ris)
})
onloading.value = false
onloading.value = true;
await globalStore.loadPage('/' + mypathin.value, 'cmypageelem').then((ris) => {
rec.value = ris;
if (ris && ris.hideHeader) {
globalStore.setshowHeader(false);
}
// console.log('LoadPage', ris)
});
onloading.value = false;
}
if (mypathin.value === 'home_logout' && globalStore.site.name === 'local' && !rec.value) {
$router.replace('/install_site')
if (
mypathin.value === 'home_logout' &&
globalStore.site.name === 'local' &&
!rec.value
) {
$router.replace('/install_site');
}
if (tools.isManager()) {
@@ -131,22 +143,26 @@ export default defineComponent({
}
}
watch(() => props.mypath, (to: string, from: string) => {
// console.log('... load', mypathin.value, props.mypath)
selElem.value = {}
load()
})
watch(
() => props.mypath,
(to: string, from: string) => {
// console.log('... load', mypathin.value, props.mypath)
selElem.value = {};
load();
}
);
watch(
() => editOn.value,
() => {
if (!editOn.value) {
selElem.value = {}
selElem.value = {};
}
})
}
);
async function mounted() {
await load()
await load();
}
function saveElem(myelem: IMyElem) {
@@ -154,39 +170,38 @@ export default defineComponent({
}
function changeVisuDrawer(path: string, edit: boolean) {
globalStore.changeVisuDrawer(path, edit)
globalStore.changeVisuDrawer(path, edit);
}
function toggleSize() {
mywidthEditor.value = mywidthEditor.value === 400 ? 1050 : 400
mywidthEditor.value = mywidthEditor.value === 400 ? 1050 : 400;
}
function deleteElem() {
selElem.value = {}
visuEditor.value = false
selElem.value = {};
visuEditor.value = false;
}
function selElemClick(myelem: IMyElem) {
console.log('mypageelem selElemClick', myelem)
console.log('mypageelem selElemClick', myelem);
try {
selElem.value = {}
selElem.value = myelem
visuEditor.value = !!myelem
selElem.value = {};
selElem.value = myelem;
visuEditor.value = !!myelem;
} catch (error) {
console.log(error)
console.log(error);
}
}
async function duplicatePage() {
await globalStore.duplicatePage(mypathin.value, $q, t)
await globalStore.duplicatePage(mypathin.value, $q, t);
}
onMounted(mounted)
onMounted(mounted);
return {
rec, myelems,
rec,
myelems,
mypathin,
editOn,
visuEditor,
@@ -205,7 +220,6 @@ export default defineComponent({
duplicatePage,
showexportPage,
showimportPage,
}
};
},
})
});

125
src/components/CMyPageElem/CMyPageElem.vue
View File

@@ -1,8 +1,15 @@
<template>
<div>
<div v-if="mypathin && !!rec">
<q-inner-loading id="spinner" :showing="onloading">
<q-spinner-tail color="primary" size="4em"> </q-spinner-tail>
<q-inner-loading
id="spinner"
:showing="onloading"
>
<q-spinner-tail
color="primary"
size="4em"
>
</q-spinner-tail>
</q-inner-loading>
<div v-if="!onloading">
@@ -27,7 +34,10 @@
elevated
style="transition: 'width 0.3s ease'"
>
<q-bar dense class="q-ma-xs bg-primary text-white">
<q-bar
dense
class="q-ma-xs bg-primary text-white"
>
<q-toolbar-title> Editor </q-toolbar-title>
<q-btn
flat
@@ -57,54 +67,91 @@
</CMyEditElem>
</q-drawer>
<div class="q-gutter-xs" style="margin-left: 1px; margin-right: 1px">
<div v-if="!!rec.img1" class="text-center">
<q-img :src="`` + rec.img1" class="img"></q-img>
<div
:class="{ 'q-gutter-xs': !rec.hideHeader }"
:style="[{'margin-left': rec.hideHeader ? 0 : 1 + 'px', 'margin-right': rec.hideHeader ? 0 : 1 + 'px' }]"
>
<div
v-if="!!rec.img1"
class="text-center"
>
<q-img
:src="`` + rec.img1"
class="img"
></q-img>
</div>
<div v-if="!!rec.content" v-html="rec.content"></div>
<q-video v-if="!!rec.video1" :src="rec.video1" :ratio="rec.ratio1">
<div
v-if="!!rec.content"
v-html="rec.content"
></div>
<q-video
v-if="!!rec.video1"
:src="rec.video1"
:ratio="rec.ratio1"
>
</q-video>
<div v-if="!!rec.img2" class="text-center">
<q-img :src="`` + rec.img2" class="img"></q-img>
<div
v-if="!!rec.img2"
class="text-center"
>
<q-img
:src="`` + rec.img2"
class="img"
></q-img>
</div>
<div v-if="!!rec.content2" v-html="rec.content2"></div>
<div
v-if="!!rec.content2"
v-html="rec.content2"
></div>
<q-video
v-if="!!rec.video2"
:src="rec.video2"
:ratio="rec.ratio2"
></q-video>
<div v-if="!!rec.img3" class="text-center">
<q-img :src="`` + rec.img2" class="img"></q-img>
<div
v-if="!!rec.img3"
class="text-center"
>
<q-img
:src="`` + rec.img2"
class="img"
></q-img>
</div>
<div v-if="!!rec.content3" v-html="rec.content3"></div>
<div
v-if="!!rec.content3"
v-html="rec.content3"
></div>
<q-video
v-if="!!rec.video3"
:src="rec.video3"
:ratio="rec.ratio3"
></q-video>
<div v-if="!!rec.content4" v-html="rec.content4"></div>
<div
v-if="!!rec.content4"
v-html="rec.content4"
></div>
<div v-for="myelem in myelems" :key="myelem._id">
<div
v-for="myelem in myelems"
:key="myelem._id"
>
<div>
<transition :duration="1000" appear>
<transition
:duration="1000"
appear
>
<CTitleBanner
v-if="
(myelem.active || editOn) &&
!!rec.path &&
myelem.titleBanner
"
v-if="(myelem.active || editOn) && !!rec.path && myelem.titleBanner"
:class="`q-pa-xs `"
:title="myelem.titleBanner"
bgcolor="bg-primary"
:clcolor="myelem.color ? `` : `text-white`"
:mystyle="
myelem.color ? `color: ${myelem.color} !important;` : ``
"
:mystyle="myelem.color ? `color: ${myelem.color} !important;` : ``"
:myclass="myelem.classBanner"
:canopen="true"
>
@@ -164,7 +211,12 @@
:styleadd="styleadd"
></CTitle>
<div v-if="!imgbackground">
<CImgTitle v-if="img" :src="img" :title="title"> </CImgTitle>
<CImgTitle
v-if="img"
:src="img"
:title="title"
>
</CImgTitle>
</div>
<slot></slot>
<div v-if="!nofooter"></div>
@@ -175,7 +227,13 @@
<q-card class="dialog_card">
<q-toolbar class="bg-primary text-white">
<q-toolbar-title> Esporta Pagina </q-toolbar-title>
<q-btn flat round color="white" icon="close" v-close-popup></q-btn>
<q-btn
flat
round
color="white"
icon="close"
v-close-popup
></q-btn>
</q-toolbar>
<q-card-section class="q-pa-xs inset-shadow">
<br />
@@ -193,7 +251,13 @@
<q-card class="dialog_card">
<q-toolbar class="bg-primary text-white">
<q-toolbar-title> Esporta Pagina </q-toolbar-title>
<q-btn flat round color="white" icon="close" v-close-popup></q-btn>
<q-btn
flat
round
color="white"
icon="close"
v-close-popup
></q-btn>
</q-toolbar>
<q-card-section class="q-pa-xs inset-shadow">
<br />
@@ -209,8 +273,7 @@
</div>
</template>
<script lang="ts" src="./CMyPageElem.ts">
</script>
<script lang="ts" src="./CMyPageElem.ts"></script>
<style lang="scss" scoped>
@import "./CMyPageElem.scss";
@import './CMyPageElem.scss';
</style>

0
src/components/CMySlideNumber/CMySlideNumber.scss Executable file
View File

76
src/components/CMySlideNumber/CMySlideNumber.ts Executable file
View File

@@ -0,0 +1,76 @@
import type { PropType } from 'vue';
import { defineComponent, ref, computed, toRef, reactive, watch, onMounted } from 'vue';
import type { ISize } from 'model';
import { IOperators } from 'model';
import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar';
import { tools } from '@tools';
import { CMySlider } from '@src/components/CMySlider';
import { shared_consts } from '@src/common/shared_vuejs';
export default defineComponent({
name: 'CMySlideNumber',
emits: ['update:modelValue'],
components: { CMySlider },
props: {
modelValue: {
type: Number,
required: true,
default: 0,
},
label: {
type: String,
required: true,
},
min: {
type: Number,
required: false,
default: 0,
},
max: {
type: Number,
required: false,
default: 100,
},
disable: {
type: Boolean,
required: false,
default: false,
},
addstr: {
type: Boolean,
required: false,
default: true,
},
},
setup(props, { emit }) {
const $q = useQuasar();
const { t } = useI18n();
const internalModel = reactive({ value: props.modelValue ?? 0 });
function modifValue(value: number) {
emit('update:modelValue', value);
}
// Sincronizzare i cambiamenti esterni con internalModel quando props cambiano
watch(
() => props.modelValue,
(newModel: number) => {
internalModel.value = newModel;
},
{ immediate: true }
);
return {
t,
shared_consts,
modifValue,
internalModel,
tools,
};
},
});

32
src/components/CMySlideNumber/CMySlideNumber.vue Executable file
View File

@@ -0,0 +1,32 @@
<template>
<div style="width: 380px">
<q-banner
rounded
dense
class="bg-blue-1 text-red"
color="primary q-title"
style="text-align: center"
>
{{ label }}
</q-banner>
<div class="column">
<CMySlider
v-model="internalModel.value"
:label="label"
:min="min"
:max="max"
color="green"
@update:model-value="modifValue"
></CMySlider>
</div>
</div>
</template>
<script lang="ts" src="./CMySlideNumber.ts">
</script>
<style lang="scss" scoped>
@import './CMySlideNumber.scss';
</style>

1
src/components/CMySlideNumber/index.ts Executable file
View File

@@ -0,0 +1 @@
export {default as CMySlideNumber} from './CMySlideNumber.vue'

10
src/components/CText/CText.vue
View File

@@ -9,7 +9,8 @@
width: rectext.font?.perc_text ?? '50%',
...( rectext.size && rectext.size.height ? { height: tools.adjustSize(optcatalogo, rectext.size.height) } : {}),
marginTop: '0',
'--scalecatalog': tools.getScale(optcatalogo),
'--scalecatalogx': tools.getScaleX(optcatalogo, scheda),
'--scalecatalogy': tools.getScaleY(optcatalogo, scheda),
'line-height': rectext.font?.line_height,
}"
>
@@ -25,11 +26,12 @@
:class="{ 'flex-details_and_barcode' : show_at_right }"
:style="{
width: rectext.font?.perc_text ?? '50%',
...( rectext.size && rectext.size.height ? { height: tools.adjustSize(optcatalogo, rectext.size.height) } : {}),
...( rectext.size && rectext.size.height ? { height: tools.adjustSize(optcatalogo, rectext.size.height, scheda, false) } : {}),
marginTop: '0rem',
'--scalecatalog': tools.getScale(optcatalogo),
'--scalecatalogx': tools.getScaleX(optcatalogo, scheda),
'--scalecatalogy': tools.getScaleY(optcatalogo, scheda),
'line-height': rectext.font?.line_height,
'gap': show_at_right && scheda.barcode.size?.gap ? tools.adjustSize(optcatalogo, scheda.barcode.size?.gap) : ''
'gap': show_at_right && scheda.barcode.size?.gap ? tools.adjustSize(optcatalogo, scheda.barcode.size?.gap, scheda, false) : ''
}"
>
<div v-html="getTesto"></div>

1
src/components/MyHeader/MyHeader.ts
View File

@@ -581,6 +581,7 @@ export default defineComponent({
tools.setCookie('menu3oriz', globalStore.leftDrawerOpen ? '1' : '0');
}
onBeforeMount(BeforeMount);
onMounted(mounted);

4
src/components/MyHeader/MyHeader.vue
View File

@@ -1,5 +1,5 @@
<template>
<div>
<div v-if="globalStore.showHeader">
<q-header v-if="site" reveal elevated :class="getClassColorHeader" :style="`color: ` + getColorText + `;`">
<q-toolbar color="primary" :glossy="!$q.platform.is.ios && !$q.platform.is.android" :inverted="$q.platform.is.ios"
class="toolbar">
@@ -228,7 +228,7 @@
</div>
<div style="margin-top: 120px"></div>
<div v-show="!tools.isLogged()">
<div class="q-ma-md" style="">
<div v-if="site.confpages && site.confpages.showRegButton" class="q-ma-md" style="">
<CSigninNoreg :showregbutt="site.confpages && site.confpages.showRegButton">
</CSigninNoreg>
</div>