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

- Impostato i Font giusti e la corretta disposizione del testo e dei suoi margini.

Browse Source 
- L'immagine del libro, se è piccolo, viene adattato alla dimensione fissa (vedere se va bene).
This commit is contained in:
Surya Paolo
2024-11-24 14:40:29 +01:00
parent 6a6c15b62c
commit e10ff192bf
18 changed files with 392 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -48,23 +48,58 @@
</q-page-sticky>
<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
:class="[
'flex q-pa-xs', // Classi comuni
'flex', // Classi comuni
'image-container',
{ 'shadow-2': options.in_3d }, // Classe condizionale
scheda.posiz_text === costanti.POSIZ_TESTO.IN_BASSO
? 'flex-col'
: 'flex-row', // Layout flessibile
]"
:style="{
justifyContent: 'center',
alignItems: 'center',
gap: '0.5rem',
justifyContent:
scheda.posiz_text === costanti.POSIZ_TESTO.IN_BASSO
? 'center'
: 'flex-start',
alignItems: 'stretch', // Cambiato in 'stretch' per occupare l'altezza
gap:
tools.adjustSize(
optcatalogo,
scheda.dimensioni?.scheda_prodotto?.size.gap
) ?? '0.1rem',
width:
tools.adjustSize(
optcatalogo,
scheda.dimensioni?.scheda_prodotto?.size.width
) ?? '100%',
height: tools.adjustSize(
optcatalogo,
scheda.dimensioni?.scheda_prodotto?.size.height
),
}"
>
<q-img
@@ -85,6 +120,7 @@
'image-wrapper': optcatalogo.pdf,
}"
:style="{
zIndex: 9000,
width:
scheda.posiz_text === costanti.POSIZ_TESTO.IN_BASSO
? '50%'
@@ -102,23 +138,7 @@
display: 'block',
}"
@click="click_opendetail()"
>
<div
class="absolute transparent"
style="left: 90%; top: -18px; transform: translateX(-50%)"
>
<q-btn
v-if="!optcatalogo.pdf"
color="blue-6"
class="semi-transparent"
round
icon="search"
@click.stop="toggleFullScreen"
size="sm"
/>
</div>
</q-img>
/>
<!-- Testo associato all'immagine -->
<div
:style="{
@@ -129,7 +149,7 @@
textAlign: 'center',
marginTop:
scheda.posiz_text === costanti.POSIZ_TESTO.IN_BASSO
? '1rem'
? '0.5rem'
: '0',
}"
>
@@ -138,34 +158,36 @@
:style="{
'--scalecatalog': optcatalogo.areadistampa.scale,
'line-height': scheda.line_height,
height: '100%',
display: 'flex',
flexDirection: 'column',
}"
v-html="
products.replaceKeyWordsByProduct(
optcatalogo,
myproduct,
scheda.testo_right
)
"
></div>
<div v-if="scheda.barcode && scheda.barcode.show">
<CBarCode
:value="myproduct.productInfo.code"
:format="scheda.barcode.format"
:fontsize="scheda.barcode.font?.size"
:width="
parseInt(
tools.adjustSize(optcatalogo, scheda.barcode.size?.width)
>
<div
v-html="
products.replaceKeyWordsByProduct(
optcatalogo,
myproduct,
scheda.testo_right
)
"
:height="
parseInt(
tools.adjustSize(optcatalogo, scheda.barcode.size?.height)
)
"
>
</CBarCode>
<!--:text="`ISBN: ${myproduct.productInfo.code}`"-->
style="display: flex; flex-direction: column; justify-content: space-between; height: 100%;"
></div>
<div v-if="scheda.barcode && scheda.barcode.show">
<CBarCode
:value="myproduct.productInfo.code"
:format="scheda.barcode.format"
:fontsize="scheda.barcode.font?.size"
:width="
parseInt(
tools.adjustSize(optcatalogo, scheda.barcode.size?.width)
)
"
:widthlines="scheda.barcode.widthlines"
:height="scheda.barcode.size?.height"
>
</CBarCode>
</div>
</div>
</div>
<div
@@ -173,7 +195,27 @@
:style="{
width: '100%',
textAlign: 'center',
marginTop: '1rem',
}"
>
<div
:style="{
'--scalecatalog': optcatalogo.areadistampa.scale,
'line-height': scheda.line_height,
}"
v-html="
products.replaceKeyWordsByProduct(
optcatalogo,
myproduct,
scheda.testo_bottom
)
"
></div>
</div>
<div
v-if="scheda.testo_bottom && scheda.testo_bottom.contenuto"
:style="{
width: '100%',
textAlign: 'center',
}"
>
<div